发布于 2017-02-27 12:48:18 | 112 次阅读 | 评论: 0 | 来源: 网友投递
这里有新鲜出炉的Javascript教程，程序狗速度看过来！
JavaScript客户端脚本语言
Javascript 是一种由Netscape的LiveScript发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言，主要目的是为了解决服务器端语言，比如Perl，遗留的速度问题，为客户提供更流畅的浏览效果。
如果我们页面看到的图片都是缩略图，那就需要做个图片点击放大效果，那么怎样获取图片的原始宽高呢？方法如下：
//获取图片原始宽度
function getNaturalWidthAndHeight(img) {
var image = new Image();
image.src = img.src;
return [image.width,image.height];
}
//点击缩略图弹出层，显示原始图片。
//获取class为tz_main_box下的所有p标签下的图片img
$(".tz_main_box p>img").each(function (k, v) {
$(this).unbind("click"); //解除绑定，防止弹出多次图片层。
$(this).click(function () {
var img = v; //图片对象
var imgArea = getNaturalWidthAndHeight(img);
var layerWidth = imgArea[0]+ 5;
if (layerWidth > 1080) {
layerWidth = 1080;
}
var layerHeight = imgArea[1] + 5;
if (layerHeight > 600) {
layerHeight = 600;
}
//layer弹出层插件
layer.open({
type: 1,
title: false,
closeBtn: 0,
area: [''+layerWidth+'px', '' + layerHeight + 'px'],
skin: 'layui-layer-nobg', //没有背景色
shadeClose: true,
closeBtn: 1, //显示关闭按钮
content: "<center><img src='" + $(this).attr("src") + "'></center>"
});
});
});
以上这篇Js获取图片原始宽高的实现代码就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持phperz。