Ik heb ervaring met het maken van websites in iWeb, en heb daarbij ook vaak javascript gebruikt. Dit waren echter altijd kant en klare javascriptjes, waarbij ik de html kon copy/pasten en de javascipt bestanden zo op de ftp server kon schuiven.

Nu wil ik voor mijn website erg graag een effect maken zoals op deze website: http://www.froot.nl/ (de zwarte tekstsliders). Ik heb al verschillende stukjes script gevonden die zoiets zouden kunnen doen, maar ik weet niet goed hoe deze toe te passen. Zou iemand mij op weg kunnen helpen? Of misschien weet iemand of de benodigde bestanden ergens te krijgen zijn?

Dit gaat heel moeilijk worden om dit vanuit iWeb te doen..

Waarschijnlijk kom je dan de .html bestanden aan het openmaken met een html editor. En daarna handmatig de codes erin te plaatsen.

Anders dan dat gaat het denk ik niet lukken.

Dat is gedaan met jQuery. Bestudeer de broncode van genoemde site zou ik zeggen!

Shmoo, volgens mij valt dit wel mee, soortgelijke dingen heb ik vaak gemaakt.

Macsmet, ik heb erg lang naar de broncode zitten turen maar ik kom er niet helemaal uit. Ik vond dit stukje tekst:

//GRID TEXTSLIDER

function slideText(){

   $(function(){  

     $('.grid-element').showFeatureText();    

   });

   $.fn.showFeatureText = function() {

     return this.each(function(){    

       var box = $(this);

       var text = $('p',this);    

       text.css({  }).hide();

   
       box.hover(function(){

         text.slideDown("fast");

       },function(){

         text.slideUp("fast");

       });

   
     });

    };

}

slideText();

Maar ja, hoe nu verder...

Ah, zojuist ook nog dit gevonden in de code:

<!-- SCRIPTS -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script src="http://www.froot.nl/wp-content/themes/frootv2.17/js/app/jquery.nivo.slider.pack.js" type="text/javascript"></script>
<script src="http://www.froot.nl/wp-content/themes/frootv2.17/js/app/layover.js" type="text/javascript"></script>

<script src="http://www.froot.nl/wp-content/themes/frootv2.17/js/app/froot.js" type="text/javascript"></script>
<!---->
<script type="text/javascript" src="http://apis.google.com/js/plusone.js">{lang: 'nl'}</script>