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

跪求高手指导,鼠标单击事件
本帖最后由 woaiwanb 于 2012-11-29 13:43:52 编辑
我现在有两个效果:一个是点击隐藏右边div的效果,但有缺点,就是载入网页成功后,第一次关闭右侧需要点击2下才能关闭,代码如下:
<script type="text/javascript">
    function side(a){
        if(a.innerHTML == "关闭边栏"){
            document.getElementById("div2").style.display= "none";
            document.getElementById("div1").style.width = "100%";
            document.getElementById("div2").style.width = "0px";
            a.innerHTML = "打开边栏";
        }else{
            document.getElementById("div2").style.display= "";
            document.getElementById("div1").style.width = "75%";
            document.getElementById("div2").style.width = "25%";
            a.innerHTML = "关闭边栏";
        }
    }
</script>

 

<div style="margin-left: 95%;" onclick="side(this)" ><a>关闭边栏</a></div><br />
<div id="div1"   style="float: left;width:75%;height:300px;background-color:#697896;word-break:break-all;">
    1111111111111111111111111111111111111111111111111111111111111111111111
</div>
<div id="div2"   style="float: left;width:25%;height:300px;background-color:#eeeeee;word-break:break-all;
word-wrap:break-word;" >
    <br />2222222222222222222222222
</div>

然后是第二个效果,就是点击后图片转换,载入网页时默认显示图片P1,点击一下变图片P2,再点击又变回P1,如此不断循环,(图P1为叉叉,图P2为圈圈)代码如下:
    <script language="javascript">
        function dowith() {
          
            var img = document.getElementById("img");
            if (img.src == "/images/2.gif") {
                img.src = "/images/1.gif";
             //   alert(img.src);
            }
            else {
                img.src = "/images/2.gif";
             //   alert(img.src);
            }
        }
    </script>

    <form name="form" action="" method="post">
    <button type="button" style="background: none; border: 0;" onclick="dowith();">
&n