Wordpress - 单击时显示图像

时间:2015-01-07 12:14:31

标签: jquery css wordpress onclick slideshow

我已经做了这个页面:

http://vasikaridis.gr/index2.php/?page_id=21725

在左侧,您可以看到一个垂直滑块。这些是帖子。缩略图是帖子的特色图片。

在右侧,您可以看到一个div,其左侧滑块上的最后帖子的网址为背景图片(css)。

我想要的只是当有人点击缩略图,将右侧div中的背景图像src更改为所点击的图像时。

这可能吗?因为我不知道如何解决这个问题。

提前致谢!

Vagelis

编辑:使用以下代码获取特色图像的网址:

<?php $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID, 'thumbnail') ); ?>

然后我这样做:

<div id="fbg" style="background:url('<?php echo $url ?>') center center no-repeat;"></div>

但是,当我点击缩略图时,我想如何使代码动态更改$url

请在此处查看完整代码:http://pastebin.com/18G0Pa9P

1 个答案:

答案 0 :(得分:0)

对于任何有同样问题的人:

    <script>
(function($){
$('.img').click(function(){
  var image = $(this).attr('src');
  document.getElementById("finalimg").src=image;
});
})(jQuery);
    </script>

上述脚本表示,只要点击缩略图(.img),就可以获取该缩略图的src并将其存储到变量&#39; image&#39;中。然后转到带有id finalimg的图像,并将其src替换为存储在变量&#39; image&#39;中的url。

所以一切都按预期工作。

感谢大家的时间和帮助!