Několik vychytávek v jQuery

jQuery pluginy a skriptyPrávě jsem dodělal jeden web (zatím ještě není nikde zveřejněn), kde jsem uplatnil několik pěkných a hlavně snadno implementovatelných vychytávek napsaných v jQuery. Na svém blogu je uveřejňuji hlavně pro sebe, abych je příště nemusel zase složitě hledat pomocí Googlu, ale zároveň věřím, že se budou hodit i ostatním.

Expand / Collapse

Neboli „zobraz – schovej“, prostě rozbalovací kontejner a to v několika provedeních, s různými efekty jsem našel zde:

http://adipalaz­.awardspace.com/…/ex­pand.html

Expand / Collapse skript

Rozbalovací navigace

Prostě klasické meníčko, které nabídne podpoložky když se na něj najede myší. Skript je jednoduchý a funkční.

http://be.twix­t.us/…ckerFish­.php

jQuery dropdown navigace

PopUP

Popup plugin – stačí když do kódu odkazu přidáte class=„popup“ a stránka se pak bude otvírat do nového popup okna. Kód je velmi jednoduchý, lze nastavit parametry nového okna, případně nadefinovat více tříd pro různé nastavení popupů.

http://labs.won­dergroup.com/…o­pup-plugin/

Pridani prekryvneho obrazku

Skript, který přidá překryvný (overlay) obrázek na vybrané prvky. Potřeboval jsem udělat náhledy videa, které by obsahovaly klasické přehrávací tlačítko (aby to uživatele motivovalo ke kliknutí) a ty samé obrázky jsem potřebovl mít i bez grafiky tlačítka. Skript mi můj problém vyřešil – nad náhledy videa jsem přidal překryvné obrázky.

http://stacko­verflow.com/…er­lay-jquery

jQuery overlay image

Skrolovátko

Nevím jak jinak tento skript nazvat – nejlépe bude, když se rovnou kouknete na ukázky:

http://demos.fles­ler.com/…erial­Scroll/

případně

http://demos.fles­ler.com/…ry/scro­llTo/

Využití je celá řada – zejména pak pro prezentování fotek, videí, portfolia atd…

jQuery Scroll skript

Komentáře

1
23 červen 2009, 12:25

Super zdroje, budou se hodit. Díky ;-)

 
2
23 červen 2009, 14:39

Velmi zajimave priklady. jQuery je mocny nastroj pre tych, co s nim vedia robit. Taki, ako ja su odkazani na preberanie hotovych prikladov. Takze vdaka za tip!:)

 
3
23 červen 2009, 15:33

[2] Skvělé je, že těch hotových příkladů je v jQuery strašně moc, takže 90 procent skriptů, které potřebujete je již beztak naprogramováno a stačí tedy trochu zagooglit (a případně pak lehce poupravit a přiohnout).

 
4
23 červen 2009, 16:15

Menu je hezké ale na druhou stranu takových menu je milion a většina z nich má zásadní chybu, stejně jako toto. Nemají prodlevu zmizení podnabídky pár desetin sekundy po onmouseout. Je hrozně nasírací, když omylem myšou ujedeš z podnabídky a pak se musíš složitě vracet.

 
5
Hever
25 červen 2009, 11:41

Jenom bych doplnil, že všechno toto je připravené k použití v prototype.js / scriptaculous

 
6
8 srpen 2009, 20:30

Diky za zdroje, zrovna na rozbalovaci kontejnery jsem neco hledal

 
7
Honza
26 srpen 2009, 21:09

Ahoj, měl bych dotaz k odkazovaným skriptům. Když například v prvním případě (http://adipa­laz.awardspace­.com/…) není ve skriptech ani na stránkách autorky uvedena licence resp. možnost použití, řešíte to nějak, pokud daný skript využijete? Uvedete ve skriptu její autorství, žádáte o svolení nebo si to jen trochu přebastlíte podle svého?

Jestli to chápu správně, pokud ve skriptu není uvedena nějaká „free“ licence, tak jej nesmím použít, nebo se pletu? Zase ale vzhledem k tomu, že autorka skripty uvedla takto jako článek na webu, tak asi i sama předpokládá, že to někdo využije; chtěl bych tohle trochu pochopit
Předem díky, jestli někdo bude ochotný mi to vysvětlit.

 
8
27 srpen 2009, 16:27

Zdravím,
o licensování jQuery si můžete přečíst zde: http://docs.jqu­ery.com/Licen­sing

 

Přidej komentář

Pište prosím slušně, s diakritikou a k věci. Dodržujte pravidla a využijte možnosti formátování uvedená pod formulářem.

Email nebude zveřejněn

Pravidla a možnosti formátování

  • Nepoužívejte HTML značky, blog podporuje formátování texy. Nový odstavec získáte 2x odřádkováním, odkaz: "text odkazu":odkaz, **tučně**, *kurzíva*
  • Adresy začínající na http:// budou automaticky převedeny na odkazy
  • Jediné dvě povinné položky formuláře jsou Jméno a zpráva
  • Na předchozí komentáře odkazujte zápisem [2]

 

Sekce