javascript - How to make this menu touch ready -


i didn't think touchscreens. think best if submenus appear after clicking on main menus. of course submenu has disappear if click again, , if click on another, 1 open has close , new 1 has open.

/*navmenu-left*/    var mcvm_options = {  	menuid: "menu-v",  	alignwithmainmenu: false  };    init_v_menu(mcvm_options);    function init_v_menu(a) {  	if (window.addeventlistener) window.addeventlistener("load", function () {  		start_v_menu(a)  	}, false);  	else window.attachevent && window.attachevent("onload", function () {  		start_v_menu(a)  	})  }    function start_v_menu(i) {  	var e = document.getelementbyid(i.menuid),  		j = e.offsetheight,  		b = e.getelementsbytagname("ul"),  		g = /msie|msie 6/.test(navigator.useragent);  	if (g)  		for (var h = e.getelementsbytagname("li"), = 0, l = h.length; < l; a++) {  			h[a].onmouseover = function () {  				this.classname = "onhover"  			};  			h[a].onmouseout = function () {  				this.classname = ""  			}  		}  	for (var k = function (a, b) {  			if (a.id == i.menuid) return b;  			else {  				b += a.offsettop;  				return k(a.parentnode.parentnode, b)  			}  		}, = 0; < b.length; a++) {  		var c = b[a].parentnode;  		c.getelementsbytagname("a")[0].classname += " arrow";  		b[a].style.left = c.offsetwidth + "px";  		b[a].style.top = c.offsettop + "px";  		if (i.alignwithmainmenu) {  			var d = k(c.parentnode, 0);  			if (b[a].offsettop + b[a].offsetheight + d > j) {  				var f;  				if (b[a].offsetheight > j) f = -d;  				else f = j - b[a].offsetheight - d;  				b[a].style.top = f + "px"  			}  		}  		c.onmouseover = function () {  			if (g) this.classname = "onhover";  			var = this.getelementsbytagname("ul")[0];  			if (a) {  				a.style.visibility = "visible";  				a.style.display = "block";  			}  		};  		c.onmouseout = function () {  			if (g) this.classname = "";  			this.getelementsbytagname("ul")[0].style.visibility = "hidden";  			this.getelementsbytagname("ul")[0].style.display = "none"  		}  	}  	for (var = b.length - 1; > -1; a--) b[a].style.display = "none"  }
/*nav-menu left*/        #menu-v, #menu-v ul{  	width: 230px;      position: relative;   	font-size:0;      list-style: none;   	margin: 0;   	padding: 0;   	display:block;      z-index:9;  	margin-top: 135px;  	float: left;  }          /* top level menu links style  ---------------------------------------*/    #menu-v li  {      background: url(bg.gif) repeat-x 0 2px;      list-style: none;   	margin: 0;   	padding: 0;  }  #menu-v li  {      font-size: 17px;      display: block;      color: black;      text-decoration: none;      line-height:39px;      padding-left: 26px;  	border: none;  }  #menu-v ul li  {      line-height:39px;  }                    #menu-v li a.arrow:hover  {       background-image: url(../assets/ringsenberg-pfeil-rechts.svg);      background-repeat: no-repeat;      background-position: 200px 14px;  }              /*sub level menu items  ---------------------------------------*/  #menu-v li ul  {      position: absolute;      width: 200px; /*sub menu items width */      visibility:hidden;  	margin: 0px;  }            #menu-v a.arrow  {      background-image: url(../assets/ringsenberg-pfeil-rechts.svg);      background-repeat: no-repeat;      background-position: 200px 14px;  }        #menu-v li:hover, #menu-v li.onhover  {      transition: .5s;  	background: rgba(198 ,156 ,109 , .2);  	border-bottom: solid;  	border-width: 1px;  	border-color: #c69c6d;  }  #menu-v ul li  {      background: none;  }  #menu-v ul li:hover, #menu-v ul li.onhover  {      background: #fff;  	background: rgba(198 ,156 ,109 , .2);  	border-right: solid;  	border-width: 1px;	  	border-color: #c69c6d;  }                        #menu-v li a.top {  	color: white;  	transition: .5s;  }    #menu-v li a.top:hover {  	color: black;  	background: rgba(226 ,205 ,182 , 1)  }
<ul id="menu-v">      <li><a href="#" class="top">home</a></li>      <li><a href="#">zupfinstrumente</a>          <ul class="sub">              <li><a href="#">gitarren</a></li>              <li><a href="#">ukulelen</a></li>              <li><a href="#">mandolinen</a></li>              <li><a href="#">banjos</a></li>          </ul>      </li>      <li><a href="#">streichinstrumente</a>          <ul class="sub">              <li><a href="#">violinen</a></li>              <li><a href="#">barockviolinen</a></li>          </ul>      </li>      <li><a href="#">restauration</a>          <ul class="sub">              <li><a href="#">zupfinstrumente</a></li>              <li><a href="#">streichinstrumente</a></li>          </ul>      </li>      <li><a href="#">grafikdesign</a>      	<ul class="sub">              <li><a href="#">software</a></li>              <li><a href="#">printmedien</a></li>              <li><a href="#">digitale medien</a></li>              <li><a href="#">projekte</a></li>          </ul>  	</li>      <li><a href="#">cnc-fertigung</a>          <ul class="sub">              <li><a href="#">software</a></li>              <li><a href="#">hardware</a></li>              <li><a href="#">projekte</a></li>          </ul>      </li>  </ul>


Comments

Post a Comment

Popular posts from this blog

PHP and MySQL WP -

i trying accomplish 2 things here code. writing php directly wp page using insert php plugin. 1) query mysql database , return results 1 column 4 columns. 2) make each result own hyperlink directs user new wp page runs new query on page. i able query show results , turn results dynamic hyperlink, cannot formatting down. right returns result 1 column. here have: [insert_php] $servername = "localhost"; $username = "login"; //edited privacy $password = "password"; //edited privacy $database = "database"; //edited privacy // create connection $conn = new mysqli($servername, $username, $password, $database); // check connection if ($conn->connect_error) { die("connection failed: " . $conn->connect_error); } echo "connected successfully"; //get results database $result = mysqli_query($conn,"select mine mines order mine"); $all_property = array(); //declare array saving property //showing proper...
Read more

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

i'm implementing inapp billing in android app. works well, however, i'm trying decouple broadcast receiver activity manifest. suggestion in android's trivialdrive sample: // important: dynamically register broadcast messages updated purchases. // register receiver here instead of <receiver> in manifest // because call getpurchases() @ startup, therefore can ignore // broadcasts sent while app isn't running. // note: registering listener in activity bad idea, done here // because sample. regardless, receiver must registered after // iabhelper setup, before first call getpurchases(). currently there's class extends broadcastreceiver : public class iabbroadcastreceiver extends broadcastreceiver { /** * intent action receiver should filter for. */ public static final string action = "com.android.vending.billing.purchases_updated"; private final iabbroadcastlistener mlistener; public iabbroadcastreceiver(iabbroadcastlistener listener) { m...
Read more

go - golang pprof for c library code -

i have been trying profile golang application pprof, seems details of c code(linked static library) missed in output result. flame graph from frame graph can see c code time consuming reported within "runtime._externalcode", no details @ all. , sure static library compiled debug enable. so there way make pprof details(like stack trace) of 3rd party c code? or there other golang profiling tool this?
Read more