Question

所有

我目前正在创建自己的PHP功能库，我现在需要的是一个javascript语句，用于在点击时将主图像切换为缩略图。我已经尝试了几种不同的代码，但每次我设法以某种方式搞砸了整个事情。

这是我的JSFiddle的链接： http://jsfiddle.net/m6YMb/

我尝试过使用ID切换，但它似乎无法与我合作，我担心它可能会干扰我网站上的其他图片。：/

以下是我目前在我的网页上实施的额外代码：

function toggle_visibility(id) {
        var infoBox = document.getElementsByClassName("info");
            for (var i = 0; i < infoBox.length; i++) {
                infoBox[i].style.display = 'none';
            }
        var e = document.getElementById(id);
            if(e.style.display == 'block') {
                e.style.display = 'none';
            } else {
                e.style.display = 'block';
            }
    }

    $(".heading").click(function(){
        if(!$(this).hasClass("active_heading")){
            $(".heading").removeClass("active_heading");
            $(this).addClass("active_heading");
        }    
    });

希望你们能在这里帮助我，我还在努力学习！

Answer 1

您只需要设置图像的src。

$('#carouselv').jsCarousel({ 
    onthumbnailclick: function(src) { 
       document.getElementById('photo').src=src;
    }, autoscroll: false, masked: false, itemstodisplay: 3, orientation: 'v' 
});

Answer 2

在你的小提琴例子中，只需添加$（'#photo'）。attr（'src'，src）;

`$（document）.ready（function（）{

        $('#carouselv').jsCarousel({ 
            onthumbnailclick: function(src) { 
                alert(src);
                $('#photo').attr('src', src);
            }, autoscroll: false, masked: false, itemstodisplay: 3, orientation: 'v' 
        });
    }); `

希望使用所选缩略图切换主图像

2 个答案: