Question

我一直试图弄清楚如何为我的投资组合网站创建我自己的自定义图片库无济于事。

我有一个div，可以为我的不同图像保留缩略图。这个div的CSS代码如下：

.gallery {
width: 900px;
height: 600px;
background-color: white;
margin: 50px;
float: left;
box-shadow: 3px 3px 20px #000000;
position: relative;

我创建了另一个div #project_display，它绝对位于图库div的左侧-900px。此div也设置为宽度：900px和高度：600px;

我正在尝试做的是获取缩略图的锚定链接（缩略图的较大版本图像），并动态填充此偏远的div与其中的较大图像。这很难解释。下面是代码，希望这更清楚：

$('.projects').bind('click', function(event){
    $('#project_display').animate({
        left:'0px'
        });
        event.preventDefault();

        var this_project = $('.projects').each(function(){
            $(this).children('a[href]');
        })

        $('#project_display').html('<img src="'+this_project+'"/>');
    })

大图像的锚链接没有放入外围div。

有人可以告诉我我做错了什么吗？因为我显然没有做正确的事。

Answer 1

$('.projects').bind('click', function(event){
       var aHref= $(this).attr("href");
       $('#project_display').html('<img src="'+aHref+'"/>');
       $('#project_display').animate({
           left:'0px'
       });
 });

尝试以上方法。如果不起作用请提供HTML，这将增加对代码的理解。所以我会帮你解决问题。

Jquery - 尝试创建一个图像库，可以在点击缩略图时滑入

1 个答案: