jQuery: hvordan man opbygger en udvidelse Plugin

Tirsdag den 23 september 2008

Som alle andre biblioteker af denne art også jQuery kan udvide sin grundlæggende funktionalitet ved hjælp af reelle plugin. At overholde reglerne for dens drift, nemlig restituiendo altid en pointer til den valgte eller jQuery sig selv, kan du skrive en plugin med et par linjer kode. Tag som eksempel den kode, der foreslås i jQuery mod alle: en benchmark med 5 browser, der blev (efter korrektion rapporteret af Luca):

JavaScript:
  1. ) . css ( 'cursor' , 'pointer' ) . click ( $ ( 'H2.dropdown «). CSS (' cursor ',' pointer '). Klik på (
  2. funktion () (
  3. $ ( this ) . next ( ) . is ( ':hidden' ) ) $ ( this ) . next ( ) . slideDown ( ) ; else $ ( this ) . next ( ) . slideUp ( ) ; if ($ (denne). next (). er ( ': skjult')) $ (denne). next (). slideDown (); ellers $ (denne). next (). slideUp ();
  4. )
  5. );

Fortsæt læsning ... "

Related Post

Simple Harmonika med klassen USimpleTabStrip

Onsdag den 20 august 2008

Klassen USimpleTabStrip forelagt diskret Simple TabStrip, kan også bruges til at oprette en simpel menu Harmonika.
Brug af virkningerne af BlindUp() BlindDown() tilbydes af Scriptaculous:

JavaScript:
  1. funktionen init () (
  2. ; T = new USimpleTabStrip ();
  3. ; An. Init ();
  4. ( e ) { An. OnShow = funktion (e) (
  5. ( e ) ; nye virkning. BlindDown (e);
  6. )
  7. ( e ) { An. OnHide = funktion (e) (
  8. ( e ) ; nye virkning. BlindUp (e);
  9. )
  10. )

Og lægge den tilbage på HTML (HTML kilde):

HTML:
  1. > <div class = "accordion">
  2. > Accordion 1 </a> <a href = "#acc1"> Harmonika 1 </ a>
  3. > </a> <a name = "acc1"> </ a>
  4. <h1> Content # 1 </ h1>
  5. <p> Bla bla bla .... </ p>
  6. </ Div>
  7. > Accordion 2 </a> <a href = "#acc2"> Harmonika 2 </ a>
  8. > </a> <a name = "acc2"> </ a>
  9. <h1> Content # 2 </ h1>
  10. <p> Bla bla bla .... </ p>
  11. </ Div>
  12. > Accordion 3 </a> <a href = "#acc3"> Harmonika 3 </ a>
  13. > </a> <a name = "acc3"> </ a>
  14. <h1> Content # 3 </ h1>
  15. <p> Bla bla bla .... </ p>
  16. </ Div>
  17. </ Div>

Du får en enkel menu Harmonika, der kan anvendes i meget hurtigt.

Related Post

Simple diskret TabStrip

Torsdag den 14. august, 2008

USimpleTabStrip er en diskret Javascript for at forbedre classici link anker (endnu) i et HTML-side. Denne kilde er en forbedring af den funktion, der præsenteres i TabStrip diskret. I denne version også tilpasse koden til release 1.6 af prototype.js blev oprettet en reel klasse til at forvalte TabStrip. Frigivelse her er meget enkel og ligetil. Dets vigtigste arbejde ligger i at tilføje en begivenhed, skal du klikke på linket anker normale. Ikke indsendes CSS stilarter, lige til at forlade den maksimale frihed til handling, men du kan få en effektiv TabStrip med et par linjer kode tilføje CSS, se Tilføjelse CSS styles nedenfor.

HTML

Klassen USimpleTabStrip arbejder på en meget simpel HTML, de anker sftuttando <a name></a>

HTML:
  1. <! - Simpel liste af links på siden ->
  2. > Link 1 </a> </li> <li> <a href = "#tbs1"> Link 1 </ a> </ li>
  3. > Link 2 </a> </li> <li> <a href = "#tbs2"> Link 2 </ a> </ li>
  4. > Link 3 </a> </li> <li> <a href = "#tbs3"> Link 3 </ a> </ li>
  5. </ Ul>
  6. <! - Blokke / faner ->
  7. > </a> <a name = "tbs1"> </ a>
  8. <h1> Card # 1 </ h1>
  9. <p> Bla bla bla .... </ p>
  10. </ Div>
  11. > </a> <a name = "tbs2"> </ a>
  12. <h1> Card # 2 </ h1>
  13. <p> Bla bla bla .... </ p>
  14. </ Div>
  15. > </a> <a name = "tbs3"> </ a>
  16. <h1> Card # 3 </ h1>
  17. <p> Bla bla bla .... </ p>
  18. </ Div>

Koden div lige under anker a fra beholderen.

Fortsæt læsning ... "

Related Post

Tekst erstatning teknikker i Flash

Onsdag den 25. juni, 2008

Teknik Tekst erstatning, jeg fremlægger i dag, er i visse henseender, virkelig interessant. I modsætning til det klassiske billede i stedet for via CSS, denne teknik bruger en flash for at tilsidesætte titlerne på vores site. På trods af at være en smule mere, fordi det kræver oprettelsen af en Flash-film og brugen af Javascript, tillader en række fordele ikke er ligeglade:

  • Holder 's adgang til webstedet ved hjælp af en True-diskret-Javascript, så webcrawlere og edderkopper fortsætte med at se den side, så enkel og korrekt HTML
  • Ikke kræver oprettelsen af billeder n for n titler. Bare en film til at erstatte alle titlerne på vores site, med betydelige besparelser i form af Download
  • Giver dig mulighed for at skabe enkle titler, men med Font normalt ikke anvendes på internettet
  • Teksten kan leveres i HTML, takket være de karakteristika af Flash
  • Teksten er valgbare
  • Er en flash kan du tilføje interaktivitet og animation af enhver art

Du vil opdage også, at denne procedure CSS er ikke praktisk taget højde!

Fortsæt læsning ... "

Related Post

Diskret Javascript: un po 'di klarhed og øje til imposters

Søndag 13 april, 2008

Nogle scripts, og nogle Web ved hjælp af nogle JavaScript-funktioner udgive sig for ikke-invasive (diskret), selv når de slet ikke. Hvad gør et script (normalt JavaScript) ikke indgribende? I princippet et script Javascript er ikke-påtrængende, når kan være mindre end det! Simpelthen! I at udvikle et websted anvendeligheden af det samme bør ikke afhænge af enhver script. Kun i dette tilfælde har vi en reel script diskret. Fortsæt læsning ... "

Related Post

Shadowbox assetURL: Angiv stien til billeder

Lørdag den 12 april 2008

Når Shadowbox åbnet sit vindue til at vise indhold (billede, iframe, film osv. ...), skærme, indtil en animerede gif, der kommer i pakken. Hvis den side, du bruger Shadowbox er på samme niveau mappe med billeder, alt fungerer fint. Som standard er i virkeligheden, Shadowbox søgning under den animerede GIF-billeder / loading.gif - eller billeder / laste-light.gif hvis du vælger den stil lys (shadowbox-light.css). Ellers, og ofte er der også risiko for ikke accorgesene, hvis vi er i et andet træ, vil skabe en god kode 404 - side afstivningsbjlke ikke, i vores tilfælde filen blev ikke fundet!

At løse problemet blot formatere Shadowbox med en parameter, der skal angive, bare den absolutte sti til mappen billeder: om undolog.com, for eksempel, jeg lagt de animerede gif af lastning billeder direkte i mappen i roden (hvor omkring en milliard andre websteder:). At gøre denne mappe til Shadowbox, uanset hvilken rute, vil jeg blot tilføjes:

JavaScript:
  1. / / Init shadowbox med assetURL parameter
  2. assetURL: 'http://www.undolog.com/' } ) ; Shadowbox. Init ((assetURL: »http://www.undolog.com/ '));

Related Post

Alle Lightbox kloner i en dynamisk matriks

Fredag 11 april, 2008

Planetozh har skabt et dynamisk værktøj Splendito i stand til at liste alle de Javascript biblioteker gerne Lightbox.

image

image Gennem et panel (se billedet til venstre) med en serie af "inspiration" (flueben), som viser de forskellige elementer i biblioteket, kan du køre et filter dermed generere en liste over en eller flere biblioteker, der gør vores tilfælde. Vi håber, at forfatteren fastholder opdateret denne fantastiske side, som er nyttige i den aftale mellem de mange og stadig mere magtfuld bog af denne art.

Related Post

Diskret SWFObject 2.0

Tirsdag 25 marts, 2008

swfobject SWFObject JavaScript er et script bruges til at indsætte Flash-indhold på websider. Dets vigtigste funktion er at fjerne kravet om aktivering af kontrollen med Microsoft Internet Explorer (som under alle omstændigheder, der ophørte aktiviteter - se her) og mere interessant, evnen til at kontrollere og installere Flash Player hvor det er påkrævet. SWFObject kan anses for at være et godt alternativ til at installere kit / detect, som Adobe selv og generere indersiden af din Flash (i alle dens udgaver). Med version 2.0, forbedrer SWFObject dets ydeevne og dets anvendelse. Som anført den officielle dokumentation, flyttet på Google Code, de nyheder i denne udgave er så mange, at det ikke er kompatibel med tidligere versioner. Det udmønter sig i en de facto fuldstændig revision af koden for dem, der beslutter at opgradere en tidligere version SWFObject til 2,0.

Scriptet er nu blevet bragt til den nyeste standard, både Syntaktisk og fra de "ikke-indgribende." Det støtter alle tidligere funktioner, såsom den hurtige installation af Flash Player, med en kode, mere klar og let at bruge. Passagen af de parametre, for eksempel fra JavaScript til Flash Player (og dermed til vores film) er nu langt klarere og mere alsidigt. Også indført var to vigtigste transportformer: statiske og dynamiske, i henhold til den side, type og design proces, som vi gør.

Virkelig nyttigt og bon Faktum er online-værktøj, der genererer kode SWFObject for os.

LINK:

Related Post

Scriptaculous Effect.Tween: Sådan fungerer det

Torsdag 20 marts, 2008

Blandt alle biblioteker "web 2.0" til rådighed, scriptaculous er helt sikkert det mest dårligt dokumenteret! På det officielle site, ofte langsom, dokumentation er delvis, dårligt fremstillet og vanskelige at bruge. Med de seneste udgivelser, så nogle af de nye funktioner er helt mangler, ligesom den nye bykerne virkning Tween (Effect.Tween). Sidstnævnte, der ligner Tween Flash giver dig mulighed for at manipulere tilpassede overgange. RESUMÉ sin base er: Fortsæt læsning ... "

Related Post

Light galleri: Lightview 2.0.0_rc1

Tirsdag 19 februar, 2008

Lightview For nylig udgivet her endnu diskret Javascript bibliotek for billedgallerier og meget mere. Lightview i 2.0.0_rc1 udgivelse, også tilføjer funktioner til at åbne vinduet med indhold, der rækker ud over den simple image: Flash-film, QuickTime , Form og IFRAME! Forhold til den tidligere udgave (den 1.1.0 - som opererer kun billeder), derfor denne Release Candidate er beriget funktionalitet også til stede i andre biblioteker. De værktøjer, der kræves i Lighview at arbejde er kendt Prototype 1.6.0.2 og Scriptaculous 1.8.1. Gliattributi bruges til at styre biblioteket class rel.

Interessant en forventning om at dette bibliotek er den største omhu, som grafisk viser.

Karakter: 9 - Home Lightview

Related Post