Automaticky měnící se banner

Webdesign, HTML, CSS, Flash, PHP, ASP, .NET, JavaScript. Kritika www stránek na Smetišti.

Moderátor: Moderátoři Živě.cz

Odeslat příspěvekod Capricho 10. 5. 2009 03:32

nevite jak udelat automaticky se měnici banner s ciselnym prepinanim?
Mam namysli presne jako na tomhle webu
http://eco-card.co.uk/index.htm
Capricho
Junior

Odeslat příspěvekod Vebloud 10. 5. 2009 03:49

Tohle není těžký. Podívej se do zdrojáku, používají JQuery knihovnu. Je to pár řádků kódu a hezký obrázky.
Žít a nechat žít, ty máš svůj názor, já mám svůj názor, já ti nebudu nutit svůj, nemusím souhlasit s tvým, ale udělám vše, abys ho mohl svobodně vyjádřit.
Vebloud
VIP uživatel
Uživatelský avatar

Odeslat příspěvekod Capricho 10. 5. 2009 14:24

nekdo mi kdysy poradil tuhle stranku http://www.webappers.com/
a musim rict ze je fakt super a naprana spoustou web efektu
Ale tenhle tam bohuzel neni nevite jestli neexistuje neco podobneho kde bych nasel to co hledam?
Nevim jestli bych to z toho zdrojaku dokazal vsechno vytahat.
Capricho
Junior

Odeslat příspěvekod Vebloud 10. 5. 2009 14:45

Tak zrovna tohle je opravdu easy. Pravda znám JQuery takže vím co hledat. Pro začátečníka to je horší. V Html je důležitý tohle:
Kód: Vybrat vše
<div id="banner">
   <div id="rotate">
      <a href="/products/ecocard-bloomcard.htm"><img src="/images/banners/home-2.jpg" width="840" height="270" /></a>
      <a href="/products.htm"><img src="/images/banners/home-1.jpg" width="840" height="270" /></a>
      <a href="/contact.aspx"><img src="/images/banners/home-3.jpg" width="840" height="270" /></a>
   </div>
</div>

V divu s id="rotate" je obsah co se bude rotovat.

Z JavaScriptu je důležité toto:
Kód: Vybrat vše
    <script type="text/javascript" src="/thickbox/jquery-126.js"></script>
    <script type="text/javascript" src="/jquery.cycle.all.pack.js"></script>
       
    <script type="text/javascript">
   
       $(function() {
          $('#rotate')
          .before('<div id="pager">')
         .cycle({
             fx:     'fade',
             speed:  'slow',
             timeout: 6000,
             pager:  '#pager'
         });
       });
   
    </script>

První dva řádky jsou knihovny. První je základní balík JQuery což je hodně užitečná věc na AJAX a vůbec na JS, validaci a všechny možné efekty.
To druhé je cycle plugin k JQuery, který dělá tu sktečnou rotaci. Na jejich stránkách jsou i tutoriály ze kterých myslím pochopíš co znamená ten zbytek.

Jinak JQuery je pořádnej kanón se kterým se dá s JavaScriptem kouzlit.
Žít a nechat žít, ty máš svůj názor, já mám svůj názor, já ti nebudu nutit svůj, nemusím souhlasit s tvým, ale udělám vše, abys ho mohl svobodně vyjádřit.
Vebloud
VIP uživatel
Uživatelský avatar

Odeslat příspěvekod Capricho 10. 5. 2009 15:09

diky moc, du to vyzkouset
Capricho
Junior


Kdo je online

Uživatelé procházející toto fórum: Žádní registrovaní uživatelé a 0 návštevníků