Template:Team:HokkaidoU Japan/LargeDropDown/JS

From 2014.igem.org

(Difference between revisions)
 
(84 intermediate revisions not shown)
Line 2: Line 2:
<script type="text/javascript">
<script type="text/javascript">
-
var _gaq = _gaq || [];
+
$(function() {
-
   _gaq.push(['_setAccount', 'UA-7243260-2']);
+
    var $menu = $('#ldd_menu');
-
  _gaq.push(['_trackPageview']);
+
                    var $child   = $menu.children(".menu_button");
 +
                    $child.hover(function() {
 +
                    var $number = $child.index(this);
 +
 +
            $child.eq($number).find('.ldd_submenu').stop().slideDown(300);
 +
} ,function(){
 +
                                          $child.find('.ldd_submenu').stop(true).slideUp(300);
-
  (function() {
+
});
-
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
+
});
-
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
+
-
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
+
-
  })();
+
-
        $(function() {
+
-
/**
+
-
* the menu
+
-
*/
+
-
var $menu = $('#ldd_menu');
+
-
+
-
/**
+
-
* for each list element,
+
-
* we show the submenu when hovering and
+
-
* expand the span element (title) to 510px
+
-
*/
+
-
$menu.children('li').slice(1,3).each(function(){
+
-
var $this = $(this);
+
-
var $span = $this.children('span');
+
-
$span.data('width',$span.width());
+
-
+
-
$this.bind('mouseenter',function(){
+
-
$menu.find('.ldd_submenu').stop(true,true).hide();
+
-
$span.stop().animate({'width':'540px'},300,function(){
+
-
$this.find('.ldd_submenu').slideDown(300);
+
-
});
+
-
}).bind('mouseleave',function(){
+
-
$this.find('.ldd_submenu').stop(true,true).hide();
+
-
$span.stop().animate({'width':$span.data('width')+'+=30px'},300);
+
-
});
+
-
});
+
-
            });
+
</script>
</script>
</html>
</html>

Latest revision as of 13:12, 17 October 2014