• JS图片放大1


    $(function () {
    //$(".pimg").click(function () {
    $(".layer-photos-demo img").click(function () {
    var _this = $(this);//将当前的pimg元素作为_this传入函数
    imgShow("#outerdiv", "#innerdiv", "#bigimg", _this);
    });
    });

    function imgShow(outerdiv, innerdiv, bigimg, _this) {
    var src = _this.attr("src");
    $(bigimg).attr("src", src);

    /*获取当前点击图片的真实大小,并显示弹出层及大图*/
    $("<img/>").attr("src", src).load(function () {
    var windowW = $(window).width();
    var windowH = $(window).height();
    var realWidth = this.width;
    var realHeight = this.height;
    var imgWidth, imgHeight;
    var scale = 0.8;

    if (realHeight > windowH * scale) {
    imgHeight = windowH * scale;
    imgWidth = imgHeight / realHeight * realWidth;
    if (imgWidth > windowW * scale) {
    imgWidth = windowW * scale;
    }
    } else if (realWidth > windowW * scale) {
    imgWidth = windowW * scale;
    imgHeight = imgWidth / realWidth * realHeight;
    } else {
    imgWidth = realWidth;
    imgHeight = realHeight;
    }
    $(bigimg).css("width", imgWidth);

    var w = (windowW - imgWidth) / 2;
    var h = (windowH - imgHeight) / 2;
    $(innerdiv).css({ "top": h, "left": w });
    $(outerdiv).fadeIn("fast");
    });
    $(outerdiv).click(function () {
    $(this).fadeOut("fast");
    });
    }

  • 相关阅读:
    (五)消费Dubbo服务
    (四)Dubbo Admin管理控制台
    (三)发布Dubbo服务
    (二)zookeeper安装
    (一)Dubbo简介
    解决tomcat 启动 一闪而过
    Redis的数据结构之哈希
    Redis的数据结构之字符串
    Jedis 连接池实例
    linux/centos定时任务cron
  • 原文地址:https://www.cnblogs.com/Ly426/p/9768613.html
Copyright © 2020-2023  润新知