我正在使用来自 this 的 jquery 和 css3 照片库站点,我希望能够放大图像 onclick。作者说有一种方法可以做到这一点,但没有明确说明如何(我不是 jquery 专家)。
我尝试创建一个单独的脚本来更改图像的宽度和高度,但我认为现有的 jquery 或 css 可能已经覆盖了它。
这只是一个测试,看看我是否可以来回更改它:
var size = false;
function enlarge(){
if (size == false){
document.getElementById("photo1").style.width = "100%";
document.getElementById("photo1").style.height = "100%";
size = true;
}
else{
document.getElementById('photo1').width = '134px';
document.getElementById('photo1').height = '134px';
size = false;
}
关于如何实现这一点有什么想法吗?
最佳答案
我想到了三种不同的方法来完成您的要求(就在我的脑海中)。
- 从较小版本的图像开始,当用户点击它时,它会切换到较大版本(这样模糊程度最低)
- 更改包含元素的大小。确保包含元素的样式为
max-width:100%;最大高度:100%;
- 使用CSS3 transformations (2D/3D 比例)
我创建了一个 jsFiddle 来演示最后两个选项(我假设您可以轻松找出第一个)。
至于插件是否劫持了你的样式修改,这需要你具体代码调试一下。
关于javascript - 向 jquery 宝丽来画廊添加缩放功能,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11021269/