I want a simple effect of slide up and down. I'm new to jquery and I tried th following code, but it's not working
<script> $(document).ready(function() { $('#fade li:first-child').css('display','none'); $('#fade li:second-child').click(function() { $('#fade li:first-child').slideDown(); }) }) </script> Html
<ul id="fade"> <li>one</li> <li>two</li> <li>three</li> </ul> Please help, thanks
error in this line:
$('#fade li:second-child') use :nth-child(2) selector to fetch 2-nd element or $('#fade li').eq(1)
<script> $(document).ready(function(){ $('#fade li:first-child').css('display','none'); $('#fade li:nth-child(2)').click(function(){ $('#fade li:first-child').slideDown(); }) }) </script> try this code
$(document).ready(function(){ $('#fade li:first-child').css('display','none'); $('#fade li').click(function(){ $('#fade li:first-child').slideDown(); }) }) Give this a go:
$(document).ready(function(){ var mySlider = function( toggle, obj ) { toggle.click(function(e){ if( !obj.is( ':visible' ) ) { obj.slideDown(); } else { obj.slideUp(); } }); } var slide_toggle = $('#fade li:nth-child(2)'); var menu = $('#fade li:first-child'); menu.css( 'display', 'none' ); mySlider( slide_toggle, menu ); }); Are you missing <script type='text/javascript'> I did not found anything wrong with your code.
