HTML-menu

[Max306542]

Het begint erop te lijken! De link "home" begint (samen met het onderste deel van de pagina) te trillen, dus er komt beweging in!

Ik zat ook een beetje te googleën, en kwam op deze site uit: http://www.dynamicdrive.com/style/csslibrary/item/css-image-gallery/
Die twee codes heb ik ook geprobeerd, maar doen het ook niet. De naam van het effect is Thumb Nail Display..

Het menu wilde ik gewoon met afbeeldingen maken (de menubuttons), die een link hebben naar de pagina's.

 

[Naarling]

Ik zat ook een beetje te googleën, en kwam op deze site uit: http://www.dynamicdrive.com/style/csslibrary/item/css-image-gallery/
Die twee codes heb ik ook geprobeerd, maar doen het ook niet. De naam van het effect is Thumb Nail Display..

Die past eenzelfde soort methode toe als ik je eerst gegeven had.

Het begint erop te lijken! De link "home" begint (samen met het onderste deel van de pagina) te trillen, dus er komt beweging in!

Heb je een online voorbeeld?

 

[Max306542]

De website staat nog niet online.. geloof ik..

en dan het kopje "test" (website is nog láng niet af, verre van wat ik wilde maken). Ik weet niet of je hem kunt zien..

 

[Naarling]

1) De link met afbeelding moet natuurlijk wel in de lijst staan, anders werkt het niet. Die <br> horen daar ook niet maar ik vermoed dat die automatisch zijn toegevoegd door Wordpress.

2) Ik weet niet waarom maar de code die ik eerst gebruikte lijkt niet meer te werken, dit werkt wel.

<ul style="list-style:none; position:relative;">
<li>
<a onmouseover="this.children[0].style.display='block'"      onmouseout="this.children[0].style.display='none'" href="home" >
    <img src="http://*knip*.nl/wp-content/uploads/2012/07/Test11-300x224.jpg"  alt="Beschrijving" style="position:absolute; left:100px; top:0; display:none;">Home</a>
    </Li>
</ul>

Dus this.children[0] in plaats van firstChild.

 

[Max306542]

Hij trilt al minder.. Maar er verschijnt nog geen plaatje..

 

[Naarling]

Komt door die <br> die Wordpress invoegt, probeer de code eens als één lijn in te voeren, zo dus.

<ul style="list-style:none; position:relative;"><li><a onmouseover="this.children[0].style.display='block'"onmouseout="this.children[0].style.display='none'" href="home" ><img src="http://*knip*.nl/wp-content/uploads/2012/07/Test11-300x224.jpg"  alt="Beschrijving" style="position:absolute; left:100px; top:0; display:none;">Home</a></Li></ul>

 

[Max306542]

Hij doet het, dank je wel!