Rumah > hujung hadapan web > html tutorial > 鼠标经过切换不同的显示内容怎么做呢?_html/css_WEB-ITnose

鼠标经过切换不同的显示内容怎么做呢?_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Lepaskan: 2016-06-21 09:00:17
asal
2150 orang telah melayarinya

鼠标经过切换不同的显示内容怎么做呢?  类似这个网站上     鼠标移动上面菜单 下面的内容会切换 求别删图片 真心求教


回复讨论(解决方案)

在线急等······

我还在等。。

仍然在等。。。

建议百度关键字:js tab选项卡。
http://www.baidu.com/s?ie=utf-8&f=3&rsv_bp=1&tn=baidu&wd=tab%E9%80%89%E9%A1%B9%E5%8D%A1&oq=js%20tab%E9%80%89%E9%A1%B9%E5%8D%A1&rsv_pq=d492a3da0009aea6&rsv_t=7c449SlOK3Rg3Wz5eHTM%2Fa5SOUPBCXEUx1aN4WQgyXUev9Cq4ZuUujwziEw&rsv_enter=0&rsv_sug3=1&rsv_sug1=1&prefixsug=tab%E9%80%89%E9%A1%B9%E5%8D%A1&rsp=0&rsv_sug7=100&inputT=1014&rsv_sug4=1014

function $(id){	return typeof id==='string'?document.getElementById(id):id;}window.onload=function(){	//获取鼠标滑过或点击的标签和要切换内容的元素	var titles=$('notice-tit').getElementsByTagName('li'); 	var divs=$('notice-con').getElementsByTagName('div');	if(titles.length!=divs.length)	return;    // 遍历titles下的所有li    for(var i=0;i<titles.length;i++){    	titles[i].id=i;    	titles[i].onmouseover=function(){    		//清除所有li上的class    		for(var j=0;j<titles.length;j++){    			titles[j].className="";    			divs[j].style.display='none';    		}    		// 设置当前划过的class为高亮    		this.className="select";    		divs[this.id].style.display='block';    	}     }};
Salin selepas log masuk

你要是看不懂,私聊我,我给你代码把

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan