Autor Zpráva
zoomprojekt
Profil
Prosím o radu jak zprovoznit tento script. Snažím se to naroubovat do svých stránek, ale i když použiju jenom čistě kód uvedený na stránkách a zkopíruju ho, stejně mi to nefungue, přitom na oněch stránkách mi ta funkce v uvedeném příkladu funguje, takže problém nebude v prohlížeči, nýbrž v tom, že někdě dělám nějakou blbou chybu, za kterou se budu určitě hrozně stydět.
Na zkoušku jsem vytvořil html soubor:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <meta name="generator" content="PSPad editor, www.pspad.com">
  <title></title>
   <link rel="stylesheet" type="text/css" href="testmnu.css">

  </head>
  <body>
  
  <script>
// Create a clone of the menu, right next to original.
$('.menu').addClass('original').clone().insertAfter('.menu').addClass('cloned').css('position','fixed').css('top','0').css('margin-top','0').css('z-index','500').removeClass('original').hide();

scrollIntervalID = setInterval(stickIt, 10);


function stickIt() {

  var orgElementPos = $('.original').offset();
  orgElementTop = orgElementPos.top;               

  if ($(window).scrollTop() >= (orgElementTop)) {
    // scrolled past the original position; now only show the cloned, sticky element.

    // Cloned element should always have same left position and width as original element.     
    orgElement = $('.original');
    coordsOrgElement = orgElement.offset();
    leftOrgElement = coordsOrgElement.left;  
    widthOrgElement = orgElement.css('width');
    $('.cloned').css('left',leftOrgElement+'px').css('top',0).css('width',widthOrgElement).show();
    $('.original').css('visibility','hidden');
  } else {
    // not scrolled past the menu; only show the original menu.
    $('.cloned').hide();
    $('.original').css('visibility','visible');
  }
}
</script>

<header>
  <div class="logo">STICKY MENU ON SCROLL!</div>
  <div class="intro">Some dumbass tagline goes here</div>
  <div class="menu">Menu goes here - home - links - blah blah</div>
</header>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />(Bottom!)
  </body>
</html>

následně v hlavičce odkazovaný css soubor testmnu.css
* {font-family:arial; margin:0; padding:0;}
.logo {font-size:40px; font-weight:bold;color:#00a; font-style:italic;}
.intro {color:#777; font-style:italic; margin:10px 0;}
.menu {background:#00a; color:#fff; height:40px; line-height:40px;letter-spacing:1px; width:100%;}
.content {margin-top:10px;}
.menu-padding {padding-top:40px;}
.content {padding:10px;}
.content p {margin-bottom:20px;}

a ať s tím dělám co chci, stejně se mi ten script nechce spustit.
Prosím o radu nebo já vím o JS úplné..
Díky!
Keeehi
Profil
Když si na té odkázané stránce klepneš na to ozubené kolečko vedle JS, tak ti vyskočí okno s částí Add External JavaScript - to jsou externí javascripty, které tam ta stránka dodává, i když nejsou uvedené v kódu. On totiž ten script není čistý javascript ale využívá knihovnu jQuery, kterou tedy i ty musíš dodat do tvého projektu. Tím by bylo potřeba začít. No a protože je to napsané tak prasácky, tak ten javascript nemůže být umístěn v kódu nad menu, protože se spoléhá na to, že menu už je vytvořené. Takže by to šlo takto.

Nejlepší by ale bylo na to celé zapomenout a udělat to hezčeji a bez zbytečného používání zbytečně velké knihovny. A abych byl hodně hodný, dám ti odkaz na krásný kvalitní článek (resp. web, projdi si těch článků co nejvíce) který je dokonce i v češtině!
zoomprojekt
Profil
Díky moc :)
zoomprojekt
Profil
Keeehi:
Měl bych na tebe ještě jeden dotaz, když použiju kód ze stránek, které jsi uvedl nějak takto, tak mám problém s tím, že menu se přilepí okamžitě a ne až potom, co k němu úplně scrolluji. Mohl bys mi prosím ještě poradit? Děkuji.

Vaše odpověď

Mohlo by se hodit

Neumíte-li správně určit příčinu chyby, vkládejte odkazy na živé ukázky.
Užíváte-li nějakou cizí knihovnu, ukažte odpovídajícím, kde jste ji vzali.

Užitečné odkazy:

Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: