首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >在Javascript中单击图像时出现的问题

在Javascript中单击图像时出现的问题
EN

Stack Overflow用户
提问于 2012-12-13 07:56:59
回答 1查看 45关注 0票数 1

我正在用javascript制作一个图片库,当我点击一张图片来放大它,而不是放大到页面的中心,它就会完全离开页面。如何让图像在放大时移到中心?我的画廊应该在午夜到期,我就是不能让它工作!我的教授暗示我需要让图像在放大时向上和向左移动。如果有人能帮忙,我将不胜感激!

EN

回答 1

Stack Overflow用户

发布于 2012-12-13 08:02:13

在没有看到代码的情况下,我只能解释概念。你必须同时使用JS和CSS。下面是一个示例:

这是JS:

代码语言:javascript
复制
 $(document).ready(function(){
            if($(".myImage img").width() > $(".myImage").width()) {
                var url = $(".myImage img").prop("src");
                $(".myImage").css("background","url("+url+") no-repeat center center").empty();                
            }else{
                $(".myImage img").width($(".myImage").width()).height($(".myImage").height());
            }
        });

这是HTML:

代码语言:javascript
复制
<div class="myImage">
        <img src="http://cdn.walyou.com/wp-content/uploads//2010/12/facebook-profile-picture-no-pic-avatar.jpg" width="350"/>
    </div>

最后是CSS中的代码:

代码语言:javascript
复制
.myImage { border:1px solid #000; width:300px; height:300px; overflow:hidden; }
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/13850778

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档