在淘宝,京东等其他网页上我们能够看到,当鼠标移上去的时候,能够使其下面出现其它选项,现在就演示一下这种功能
主要是用到css里面的display,以及鼠标触发的事件onmouseover(),和onmouseout()方式,在加上css样式的设置和标签之间额使用就能实现。
具体如下:
1,为了很好的控制,采用了列表的样式,并且在设置css样式时很方便
2,采用了标签的样式,能够让鼠标移上去对其他的有反应
具体的js函数写的功能:
html部分的代码:
最新新闻
最新新闻内容摘要《机密》1
最新新闻内容摘要《机密》2
最新新闻内容摘要《机密》3
最新新闻内容摘要《机密》4
最新新闻内容摘要《机密》5
新浪新闻
最新新闻内容摘要《机密》1
最新新闻内容摘要《机密》2
最新新闻内容摘要《机密》3
最新新闻内容摘要《机密》4
最新新闻内容摘要《机密》5
社会新闻
最新新闻内容摘要《机密》1
最新新闻内容摘要《机密》2
最新新闻内容摘要《机密》3
最新新闻内容摘要《机密》4
最新新闻内容摘要《机密》5
最新新闻
最新新闻内容摘要《机密》1
最新新闻内容摘要《机密》2
最新新闻内容摘要《机密》3
最新新闻内容摘要《机密》4
最新新闻内容摘要《机密》5
除了上面很重要css的设置也很重要,如下:
效果图 1:鼠标没有移上去时候

效果图 2 :

完整代码:
隐藏的内容
采用大量的css模型进行修饰
传入this对象
function open1(node){
var node1=node;
var nodes=node1.getElementsByTagName("ul")[0];
with(nodes.style){
display= (display=="block")? "none" : "block";
}
}
-->
Menufloat.html