javascript - Hide/Show div, how to change tag within script -
i have simple working script shows , hides div.
the problem cannot set tag id or class , set element selector not want. can change within js allow me set class can show/hide on click. fiddle http://jsfiddle.net/dxway/2/
$("p").click(function () { $("div").slidetoggle("slow"); }) p { border:0 none; font-size:2em; background:transparent; } div { display:none; width:400px; height:200px; background:#f5f5f5; } <p>hello</p> <div class="div">hello</div>
were trying create accordion?
<div id="portfolio"> <div class="portfolio-img"> <a class="togglebtn">click me!</a> <div class="content">lorem ipsum dolor sit amet, consectetur adipisicing elit. inventore accusamus porro modi ut itaque ipsum natus explicabo vero sequi beatae libero voluptatibus sit culpa debitis tempore! sint eum ipsum consequatur!</div> </div> </div> #portfolio { background: none repeat scroll 0 0 #eeeeee; border-radius: 10px 10px 10px 10px; float: left; width: 200px; } #portfolio .portfolio-img { width:100%; background:#ccc; overflow:hidden; float:left; clear:left; } .togglebtn { background:deepskyblue; display:block; float:left; width:100%; padding:10px; border-bottom:1px solid #ccc; border-top:1px solid #fff; color:#fff; cursor:pointer; } .content { background:skyblue; float:left; overflow:hidden; width:100%; padding:10px; } $('.content').hide(); $('.togglebtn').on('click', function() { $(this).next('.content').slidetoggle(); return false; });
Comments
Post a Comment