JQuery, una libreria JavaScript, include la frase "Scrivi di meno, fare di più" sotto il logo sulla sua homepage. Gli sviluppatori Web scrivono meno codice JavaScript utilizzando jQuery, perché le sue librerie di gestire compiti complessi che normalmente richiedono ampia di codifica. Lo spostamento di un blocco DIV HTML intorno a una pagina Web, per esempio, non è un compito semplice. Utilizzando jQuery, è possibile aggiungere una riga a una funzione JavaScript, e trasformare qualsiasi DIV nella tua pagina in un componente trascinabile.

istruzione

1 Lanciate il vostro editor HTML o un editor di testo normale. Aprire un documento HTML e incollare il seguente codice JavaScript all'interno della sezione head del documento:

<Script type = "text / javascript"> </ script>

<Script type = "text / javascript"> </ script>

<Script type = "text / javascript">

Questo codice, ospitato da Google, rende i componenti necessari JQuery a disposizione del documento HTML.

2 Aggiungere la seguente istruzione DIV alla sezione corpo del documento:

<Div id = "div1">

<H1> Questa è una linea del DIV. Fare clic e trascinare questa voce per spostarla </ h1>

</ Div>

Questo DIV, il cui ID è "div1", contiene un titolo.

3 Incollare il seguente codice JavaScript nella sezione head di script del documento:

<Script language = tipo "javascript" = "text / javascript">

$ (Function () {

$ ( "# Div1") .draggable ();

});

</ Script>

Questa funzione indicata viene eseguito quando la pagina viene caricata. Esso contiene una riga di codice. Questo codice permette il plug-in Draggable JQuery che rende possibile per voi di trascinare gli oggetti in una pagina Web. Notare il nome "div1" all'inizio della comunicazione. Questo è l'id del div creato nel passaggio 2.

4 Salvare il documento e aprirlo nel browser. Viene visualizzata la rubrica all'interno del DIV. Fare clic e trascinare il titolo in qualsiasi posizione nella pagina Web.

Consigli e avvertenze

• Per fare qualsiasi DIV trascinabili, dargli un valore di ID univoco, come mostrato in questi passaggi, e l'uso che id nella funzione JavaScript. Questo esempio utilizza un elemento di paragrafo all'interno del DIV. Mettere tutto quello che vuoi all'interno del blocco DIV. Aggiungere un'immagine o un video, per esempio, e visitatori del sito potranno riposizionare gli elementi e cliccando e trascinando.
• Anche se si aggiunge una sola istruzione alla funzione JavaScript, ci vogliono diversi file JavaScript per produrre questo effetto. Google ospita questi file JQuery gratuitamente. Collegando a loro invece di tenere i file sul server, si ha sempre il codice jQuery più recente disponibile. I browser nella cache anche questi file. Questo può rendere le pagine caricare un po 'più veloce se i visitatori del sito hanno già copie dei file JQuery salvati nei loro browser.