将鼠标悬停在父级上时打开子菜单

时间:2015-10-09 10:23:19

标签: html css

我有一个包含多个子菜单的菜单。当在智能手机上时,菜单会打开所有子菜单,但它变得太长,因此我希望它仅在单击其父级时打开。我用这个

隐藏了它
#cssmenu ul ul ul {
    visibility:hidden;
}

然后我这样做了:

#cssmenu ul  ul  li:hover > #cssmenu ul ul ul li{
    visibility:visible;
}

因此,当我将鼠标悬停在它上面时会显示回来,但这不起作用。 我该怎么办?

2 个答案:

答案 0 :(得分:1)

应该是

#cssmenu ul  ul  li:hover > ul {visibility:visible;}

但我建议您使用display:nonedisplay:block

答案 1 :(得分:0)



@Override
public void onClick(View v) {

    if (v == btnSMS) {
        // Create Inbox box URI
        Uri inboxURI = Uri.parse("content://mms-sms/conversations");
        // Get Content Resolver object, which will deal with Content Provider
        ContentResolver cr = getContentResolver();
        // Fetch Inbox SMS Message from Built-in Content Provider
        Cursor a = cr.query(inboxURI, new String[] {"*"}, null, null, "normalized_date desc");
        // Attach Cursor with adapter and display in listView
        adapter1 = new SimpleCursorAdapter(this, R.layout.row, a,
                new String[]{ "body", "date", "address","_id"},
                new int[]{ R.id.lblMsg, R.id.lblDate, R.id.lblNumber, R.id.lblID }, 0);
        lvMsg.setAdapter(adapter1);
        lvMsg.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                TextView TVConvID = (TextView)findViewById(R.id.lblID);
                String ConvID = TVConvID.getText().toString();
                Uri ConvURI = Uri.parse("content://mms-sms/conversations/"+ConvID);
                Cursor b = getContentResolver().query(ConvURI, new String[]{"*"}, null, null, "normalized_date desc");
                adapter2 = new SimpleCursorAdapter(getApplicationContext(), R.layout.convrow, b,
                        new String[]{ "body", "date", "address" },
                        new int[]{ R.id.msglblMsg, R.id.msglblDate, R.id.msglblNumber }, 0);
                lvMsg.setAdapter(adapter2);
            }
        });
    }
&#13;
.menu
{
	width: 500px;
	height: 43px;
	background:#14AABE;
}

.menu ul
{
	list-style: none;
	width: 744px;
	height: 43px;
	margin: 0 auto;
	padding: 0;
}
.menu ul li
{
	float: left;
	width: 86px;
	height: 43px;
	line-height: 43px;
	text-align: center;
	margin-left: 80px;
}
.menu ul li:hover
{
	background: #14AABE;
}

.menu ul li:hover #ul
{
	display: block;
}

.menu ul li a
{
	display: block;
	color: #FFF;
	text-decoration: none;
	font-family: verdana;
	font-size: 14px;
}

#ul
{
	list-style: none;
	color: #FFF;
	display: none;
	width: 215px;
	height: auto;
	padding: 10px 0;
	background: #454545;
	opacity: 0.9;
	position: absolute;
	z-index: 1000;
}

#li
{
	float: none;
	width: auto;
	height: 20px;
	line-height: 20px;
	text-align: left;
	margin-left: 15px;
}
#li:hover
{
	background: none;
}
#li:hover #ulul
{
	display: block;
}
#li a
{
	font-size: 12px;
}
#li a:hover
{
	color: #14AABE;
}
#ulul
{
	list-style: none;
	color: #FFF;
	display: none;
	font-size: 12px;
	min-width: 230px;
	width: 150px;
	height: auto;
	background: #454545;
	opacity: 0.9;
	margin: -25px 0 0 200px;
	padding: 5px 0;
	position: absolute;
	z-index: 1000;
}
#lili
{
	float: none;
	width: auto;
	height: 20px;
	line-height: 20px;
	text-align: left;
	margin-left: 10px;
}
#lili:hover
{
	background: none;
}
.active
{
	background: #14AABE;
}
&#13;
&#13;
&#13;