javascript - Slide up when clicking on arrow -
i want content show when click on arrow slides upward hides , when click again slides down. code far keeps bringing without bringing down.
javascript
$(document).ready(function(){ $("#a_main_content").hide(); $('.arrow').click(function(){ $("#a_main_content").slidetoggle(); $(".arrow").show(); }); var value = 180 $(".arrow").rotate({ bind: { click: function(){ value +=180; $(this).rotate({ animateto:value}) } } }); }); html
<!doctype> <head> <!-- <link type="text/css" href="style/style.css" rel="stylesheet" /> --> <link rel="stylesheet" type="text/css" href="style/style.css?<?php echo time(); ?>" /> <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="jquery/jqueryrotate.js"></script> <script src="jquery/box_toggle.js"></script> </head> <body> <div id="main_header"> <div id="main_header_wrapper"> <img src="images/logo.png" alt="chattrd"/> <nav id="navigation"><b> <a href="#" class="nav_icon">home</a> <a href="#" class="nav_icon">forum</a> <a href="#" class="nav_icon">login</a> <a href="#" class="nav_icon">register</a> </b></nav> </div> </div> <div id="content_background"> <div id="content_header"> <b> announcements </b> <img src="images/arrow.png" class="arrow"> </div> <div id="a_main_content"> <center><b><u>we coming soon</u></b></center> please stand by, coming </div> </div> </body> </html>
Comments
Post a Comment