llgd.net
当前位置:首页 >> js鼠标悬停图片放大 >>

js鼠标悬停图片放大

var img = document.getElementById('img'); function bigger(){ img.style.width = '400px'; img.style.height = '400px'; } function smaller(){ img.style.width = '100px'; img.style.height = '100px'; }

设置图片的父元素为相对定位; 设置图片为绝对定位; 假设图片宽为w,高为h,放大后的宽为2w,高为2h,则计算其位置如下: left:-(2w-w)/2, top:-(2h-h)/2

问题一:标签下的第一个 后加结束标签 问题二:img 这个id应该不能直接引用,需要调用document.getElementById("img"),或者改个其他名字

很简单啊,先把图片用css缩小,再用js滑过的时候放大就好啦,图省事我就把js直接写在图片上了,你可以自己抽出来: 或者更简单的,直接用css控制,连js都不用写了: #Img1{ width:50px; height:50px;} #Img1:hover{ width:300px; height:300px;}

可以使用css来控制 .class { cursor:url('路径'),auto;}只要定义该元素的样式,给定路径后,就可以加载。 不过要注意的是,考虑到IE的兼容性问题,最好使用ico或cur格式的文件,分辨率最好是32×32。

你要显示特效的html 写出你要悬停后出现的效果写好后进行隐藏 style="display:none;"然后当你鼠标悬停在图片上的时候触发鼠标移动上去事件onmouseup和鼠标移开事件 最后就是触发的方法hoverShowDiv()与hoverHiddendiv()在js中定义 function hove...

可以使用css来控制 .class { cursor:url('路径'),auto;}cursor是支持自定义图标的 你只要定义该元素的样式,给定路径后,就可以加载。 不过要注意的是,考虑到IE的兼容性问题,最好使用ico或cur格式的文件,分辨率最好是32×32

分数太少,我只能讲一下思路 如果你有用jquery,可以 $('img').live('mouseover',function(){ $(this).css('width',150); $(this).css('height',150); }); $('img').live('mouseout',function(){ $(this).css('width',50); $(this).css('height'...

这个你可以使用CSS3搭配JAVASCRIPT来做。 好像叫什么transform你搜索一下

1、首先说下,如果你测试js代码的时候,前台可以实现鼠标悬停放大,那么就排除js的问题 2、其次,你在织梦模板里要正确引用js代码,和相关的样式文件哦 3、你调用的图片是缩略图,如果缩略图本身就只有那么小,是否就造成了图片无法放大的结果呢...

网站首页 | 网站地图
All rights reserved Powered by www.llgd.net
copyright ©right 2010-2021。
内容来自网络,如有侵犯请联系客服。zhit325@qq.com