For example... if I have 10 links and I want each list item to load (one at a time) in a row, every XX number of seconds. Link 1 Link 2 Link 3 The link needs to be able to load every XX seconds and then move on to the next one. This should be rather basic but I couldn't find any tutorials on how to do it IN ORDER for a slideshow type appearance rather than randomly picking from the list. Thanks!
Hope that can help <html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('li').hide(); for(i=1;i<$('li').size()+1;i++){ var id="#"+i; var delay = (i-1)*1000; $(id).delay(delay).fadeIn(500); } }); </script> </head> <body> <ul> <li id="1">Link 1</li> <li id="2">Link 2</li> <li id="3">Link 3</li> <li id="4">Link 4</li> <li id="5">Link 5</li> </ul> </body> </html> Code (markup):
Thanks, but this only displays the links slowly, it doesnt click and load them (I want them to load in a frame to the right of the list)
I did just read my description and it was vague to the point that it must actually load the link in another frame... The person who figures this out can have access to the tool Im building with it.
$('li').hide(); Code (markup): this will hide all your list items for(i=1;i<$('li').size()+1;i++){ Code (markup): $('li').size() gives you the number of 'li' in the document, so we can do something on each items in the list. var id="#"+i; Code (markup): for each list item we construct its id var delay = (i-1)*1000; Code (markup): we adapt the delay to each items according to its id, and so to it's position in the list $(id).delay(delay).fadeIn(500); Code (markup): well everithing is in the function's name: delay set up a delay on the following action and fadeIn apply a fade in effect... } Code (markup): And of course I close my loop I've shown you how to access each element of your list, now you have to adapt this to what you want. You can have a look on the jquery website