我一直试图弄清楚如何为我的投资组合网站创建自己的自定义图片库,但无济于事。
我有一个 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 也设置为 width: 900px 和 height: 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。
有人可以告诉我我做错了什么吗?因为我显然没有做正确的事情。