javascript - Creating A Dropline Style Menu -


i trying create dropline style menu.

please see fiddle here - http://jsfiddle.net/oampz/38c6q/

the issue i'm having is, don't want brown menu - or drop down/fade in.. i'm trying sub menu items appear in grey coloured sub div.

$('#main-nav > li').hover(function(){             if(!$(this).find('.main-link').hasclass('active')){                 $("#main-nav > li a.active").removeclass("active");                 $(this).find('.main-link').addclass("active");                 if($(this).find('li').length){                     //$("#main-nav li a.close").stop().fadein();                     //there no .close                     var = this;                     $("#sub-link-bar").stop().animate({ height: "40px"}, function(){                         $(that).find(".sub-links").show();                     });                 }                 else {                      $(this).find(".sub-links").stop().fadeout( function(){                         $(this).css('opacity','1');                         $("#sub-link-bar").stop().animate({height: "1px"});                      });                 }             }         }, function(){             if($(this).find('li').length){                 $(this).find(".sub-links").stop().hide( function(){                     $(this).css('opacity','1');                  });             }             $("#sub-link-bar").stop().animate({height: "1px"});            $(this).find('.main-link').removeclass('active');         });

any appreciated.

i've updated code http://jsfiddle.net/38c6q/1/

replaced this

$("#sub-link-bar").stop().animate({ height: "40px"}, function(){     $(that).find(".sub-links").show(); });

with

 $('#sub-menu').html(  $(that).find(".sub-links").html() )

to have them float next each other, can add css

.sub-menu li{     display:block;     padding:0;     margin:0;     float:left; }

and add colors , backgrounds links, add css 

.sub-menu a{     display:block;     margin:0 5px;     padding:5px;     text-decoration:none;     color:#333; }  .sub-menu a:hover{     background:#333;     color:#fff; }

updated demo at http://jsfiddle.net/38c6q/4/


Comments

Post a Comment

Popular posts from this blog

matlab - Deleting rows with specific rules -

i got 20*3 cell array , need delete rows contains "137", "2" , "n:t" origin data: 't' '' '' 'np(*)' '' '' [ 137] '' '' [ 2] '' '' 'are' 'and' 'np(fcc_a1#1)' '' '' '1:t' [ 1200] [0.7052] '' [1.2051e+03] [0.7076] '' 'are' 'and' 'np(fcc_a1#3)' '' '' '2:t' [ 1200] [0.0673] '' [1.2051e+03] [0.0671] '' 'are' 'and' 'np(m23c6)' '' '' '3:t' [ 1200] [0.227...
Read more

php - MySQLi multi_query results for later use -

i using mysqli multi_query work several select statemets @ time. know how handle results, able use them later in code. example: <?php //connection stuff $query = "select name, surname database1;"; $query.= "select car, year, type database2 carid='1';"; $query.= "select product, price database3;"; if ($mysqli->multi_query($query)) { if($result = $mysqli->store_result()) { while($row = $result->fetch_row()) { --> here? } } } ?> <html> <div id='persona'> <?php foreach() { --> print name + surname } ?> </div> <div id='cars'> <?php foreach() { --> print car + year + type } ?> </div> <div id='product'> <?php foreach() { --> print product + price } ?> </div> </html> one more thing, prepared statements not possible when using multiple_query, right? there no benefit in putting unrelated queries in 1 multi ...
Read more