css、js鼠标经过时更改图片

代码和图片在这个链接里
http://yunpan.cn/cjVAhebUVY7vP 访问密码 6138
我想在这里,

<!div style="height: 100px; color: #888888;" class="tp" onmouseover="this.style.background='#FFC000',this.style.color='#ffffff'" onmouseout="this.style.background='#ffffff',this.style.color='#888888'">

鼠标移动上去时图片变成第二张,但是图片位置不变。请教一下大家,
在此多谢了。

2个回答

做成一个函数就好了。。然后over和out事件改成这样

    <script>
        function mouseEvent(o, over) {
            o.style.background = over ? '#ffc000' : '#ffffff';
            o.style.color = over ? '#ffffff' : '#888888';
            var img = o.getElementsByTagName('img')[0];
            if (!img) return;
            img.src = img.src.replace(over ? '1.png' : '2.png', over ? '2.png' : '1.png');
        }
    </script>
 <div style="height: 100px; color: #888888;" onmouseover="mouseEvent(this,true)"
 onmouseout="mouseEvent(this)">...............................
</div>

etywu
光明天使米迦勒 html那个不用管了,那是我测试用的。在ie11上,你把鼠标移动到任意一个方框上,在刷新的时候就报错。
5 年多之前 回复
showbo
支付宝加好友偷能量挖,胡杨等着我的招呼 回复光明天使米迦勒: 没问题啊。。index。aspx那个也没有问题
5 年多之前 回复
etywu
光明天使米迦勒 链接在这里,上面那个没用了。http://yunpan.cn/cjVej9X5a246a 访问密码 c99d
5 年多之前 回复
etywu
光明天使米迦勒 这个链接里有我最新的代码,帮
5 年多之前 回复
showbo
支付宝加好友偷能量挖,胡杨等着我的招呼 回复光明天使米迦勒: 你的代码呢。。要放到script里面
5 年多之前 回复
etywu
光明天使米迦勒 每刷新一次,就报错一次。
5 年多之前 回复
etywu
光明天使米迦勒 你那个js代码我在用的时候浏览器老是报错,是错误: “mouseEvent”未定义。求解。
5 年多之前 回复
etywu
光明天使米迦勒 在吗.
5 年多之前 回复
etywu
光明天使米迦勒 太感谢了。刚才的确是浏览器出问题了。
5 年多之前 回复
showbo
支付宝加好友偷能量挖,胡杨等着我的招呼 回复光明天使米迦勒: 你浏览器有问题吧。。换其他浏览器试试。chrome,firefox,ie8都没有问题
5 年多之前 回复
etywu
光明天使米迦勒 我这里鼠标放上去文字马上变颜色了,图片差不多一秒钟后才更换。
5 年多之前 回复
showbo
支付宝加好友偷能量挖,胡杨等着我的招呼 回复光明天使米迦勒: 不可能啊。。执行执行个js代码更换图片而已,我这里测试鼠标放上去就变了
5 年多之前 回复
etywu
光明天使米迦勒 回复showbo: 我是从本地加载的。
5 年多之前 回复
showbo
支付宝加好友偷能量挖,胡杨等着我的招呼 回复光明天使米迦勒: 要从服务器加载肯定慢了。。要不你就做成样式的形式,在head导入,就不会出现延时了
5 年多之前 回复
etywu
光明天使米迦勒 可是,图片变的时候有点慢。
5 年多之前 回复

onmouseover="this.getElementsByTagName('img')[0].src='gongchang2.png'"
onmouseout="this.getElementsByTagName('img')[0].src='gongchang1.png'"
没验证,自己试试吧

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐