-1

为清晰和简单而彻底修改

如本网站所示，我正在使用提升变焦（镜头变焦功能）。我有一个充满二进制图像的 Radrotator，我在旋转器的 DataBound 上给出了一个 onclick 事件。Onclick 我想根据他们从 Rotator 所有客户端单击的图像更改 Rotator 上方更大的主图像。

屏幕上的图像确实发生了变化，但是，放大功能仍然显示第一张图像。

<img id="zoom_07" runat="server" src="small.jpg" alt="image" />

下面是两个javascript函数。第一个是使用 elevatezoom 来放大图像，而第二个是在旋转器中调用二进制图像的 onclick。

  <script type="text/javascript" >
jQuery(document).ready(function ($) {
    $("#zoom_07").elevateZoom({
        zoomType: "lens",
        lensShape: "round",
        lensSize: 200
    });
});

function changeImage(url) {

    var img = document.getElementById('zoom_07');
    img.src = url;
    img.setAttribute('data-zoom-image', url);
}

如何更改放大镜客户端的图像？感谢您在此问题上提供的任何帮助。

4

3 回答 3

0

我对您单击的内容和此处的网址来源做了一些广泛的假设：

(function ($) {
    // I invented this, use your element
    $('#clickemeid').click(function () { 
        // I invented this "someattr" attribute, set to where you get that
        var url = $(this).attr('someattr');
        $("#zoom_07").attr('src', url).attr('data-zoom-image', url).elevateZoom({
            zoomType: "lens",
            lensShape: "round",
            lensSize: 200
        });
    });
})(jQuery);

现在，假设您要在 src 和 data-zoom-image 之间切换

(function ($) {
    $('#zoom_07').click(function () {
        var me = $(this);
        var zoomurl = me.attr('data-zoom-image');
        var origurl = me.attr('src');
        me.attr('data-zoom-image', origurl).attr('src', zoomurl).elevateZoom({
            zoomType: "lens",
            lensShape: "round",
            lensSize: 200
        });
    });
})(jQuery);
于 2013-03-11T23:24:16.400 回答
0

jQuery是JavaScript，因此您已经在 J​​avaScript 函数中调用它。它恰好是文档就绪的匿名函数。

function changeImage(url) {
    var img = document.getElementById('zoom_07');
    img.src = url;
    img.setAttribute('data-zoom-image', url);

    $(img).elevatedZoom({
        zoomType: "lens",
        lensShape: "round",
        lensSize: 200
    });
}

上面的代码是您的事件处理程序，已更新以显示您是否希望调用该函数来更新缩放。

于 2013-03-11T23:11:47.550 回答
0

这是我采用的解决方案。我在旋转器（绑定到二进制图像）中创建了图像标签，并在点击这些图像时更改了主图像。我当然必须将二进制图像转换为常规图像，然后保存它们。

于 2013-03-12T19:53:19.760 回答