javascript - Menu item onclick call a muti css onhover event -


have trouble figuring out wold great thank in advance

i have menu looks this

html

<li class="menuitem"><a href="#" class="drop" onclick="dowork();">phones</a>          <div class="flyout">              <div class="col_1">                  <a href="#"><h3>phones</h3></a>                 <ul>                     <li><a href="https://www.google.com/" target="_top">nokie</a></li>                     <li><a href="https://www.google.com/" target="_blank">iphone</a></li>                     <                    </ul>                     </div>        </li> 

with 2 css

.menuitem:hover { border: 1px solid #777777;    /* background color , gradients */ background: #fafafa; /* old browsers */ background: -moz-linear-gradient(top, #fafafa 0%, #fcfcfc 100%); /* ff3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fafafa), color-stop(70%,#fcfcfc), color-stop(100%)); /* chrome,safari4+ */ background: -webkit-linear-gradient(top, #fafafa 0%,#fcfcfc 100%); /* chrome10+,safari5.1+ */ background: -o-linear-gradient(top, #fafafa 0%,#fcfcfc 100%); /* opera 11.10+ */ background: -ms-linear-gradient(top, #fafafa 0%,#fcfcfc 100%); /* ie10+ */ background: linear-gradient(to bottom, #fafafa 0%,#fcfcfc 100%); /* w3c */  /* rounded corners */ -moz-border-radius: 5px 5px 0px 0px; -webkit-border-radius: 5px 5px 0px 0px; border-radius: 5px 5px 0px 0px; }  .menuitem:hover .flyout  { display:block; top:auto; left:0px; } 

how call 2 class on onclick function?

use jquery add/remove or toggle class:

$( document ).ready(function() {     $("p").click(function () {         $('.menuitem').addclass('flyout');     }); }); 

this in css:

.flyout {     display:block;     top:auto;     left:0px; } 

Comments

Popular posts from this blog

How to mention the localhost in android -

php - Calling a template part from a post -

c# - String.format() DateTime With Arabic culture -