日期:2014-05-16  浏览次数:20395 次

原代码不变,在JS中增加定时切换代码
原代码只可以点击切换,要求原代码中的参数不能变,实现以下功能:
1、增加个每5秒自动切换。
2、如果鼠标移动到某导航上时等待0.5秒再切换到该导航(原因:避免鼠标移动到上面就切换,体验不好)
以下是代码:
<li onClick="changeaweb(this,'1')" class ="a1">导航A</li>
<li onClick="changeaweb(this,'2')" class ="b1">导航B</li>
<li onClick="changeaweb(this,'3')" class ="c1">导航C</li>
<li onClick="changeaweb(this,'4')" class ="d1">导航D</li>

<div  id="web1"  style="display:block;"></div>
<div  id="web2"  style="display:none;"></div>
<div  id="web3"  style="display:none;"></div>
<div  id="web4"  style="display:none;"></div>

<script>
function changeaweb(srcObj, tid) {
    var tabList = srcObj.parentNode.getElementsByTagName("li");
    if (srcObj.className == 'a1') return;
    for (var i = 0; i < tabList.length; i++) {
        if (tabList[i].className == 'a1') 
tabList[i].className = 'b1';
        tabList[i].className = 'c1';
tabList[i].className = 'd1';
    document.getElementById("web" + (i + 1)).style.display = 'none';
    }
    document.getElementById("web" + tid).style.display = '';
    srcObj.className = 'a1';
    return false;
}
</script>
给个参考的,因不可输入网址。百度搜索:宏基    如果能做出这个效果感谢万分

JavaScript 切换

------解决方案--------------------
楼上忘了还有自动切换, 我改了下

<script type="text/javascript">
        function changeaweb(srcObj, tid) {
            var tabList = srcObj.parentNode.getElementsByTagName("li");