缩放图像jQuery

缩放图像jQuery,jquery,zooming,Jquery,Zooming,我正在页面上使用缩放图像jQuery脚本。当我必须显示一个图像时,它工作正常,但当我在标记中注入3个不同的图像时,它当然失败。我想知道如何编辑脚本,以便在页面上多次使用引用的jQuery脚本 html和绑定脚本如下所示 <div id="zoomcontainer"> <div class="zoomapp" id="zoomapp"> <img id="imgRecord" class="jqzoom" src="/demo-image.jpg"/> &l

我正在页面上使用缩放图像jQuery脚本。当我必须显示一个图像时,它工作正常,但当我在标记中注入3个不同的图像时,它当然失败。我想知道如何编辑脚本,以便在页面上多次使用引用的jQuery脚本

html和绑定脚本如下所示

<div id="zoomcontainer">
<div class="zoomapp" id="zoomapp"> <img id="imgRecord" class="jqzoom" src="/demo-image.jpg"/>
 <div id="zoomerNav"> <a id="btn_up" href="#"></a> <a id="btn_dn" href="#"></a> <a id="btn_left" href="#"></a> <a id="btn_right" href="#"></a> <a id="btn_plus" href="#"></a> <a id="btn_minus" href="#"></a> <a id="btn_home" href="#"></a> </div>
    </div>

    <script type="text/javascript">
                        $(function () {
                            $('#imgRecord')
                        .grViewer({ zoomLimit: 2, renderScale: 0.5 })
                        .bind('load', function () { $('#zoomapp').css('background', $('#zoomapp').css('backgroundColor')); });
                        });
                    </script>

$(函数(){
$(“#imgRecord”)
.grViewer({zoomLimit:2,renderScale:0.5})
.bind('load',function(){$('zoomapp').css('background',$('zoomapp')).css('backgroundColor');});
});
也许这有助于:

$(function () {
    $('.imgRecord').each(function(){
        $(this)
            .grViewer({ zoomLimit: 2, renderScale: 0.5 })
            .bind('load', function () { $('#zoomapp').css('background', $('#zoomapp').css('backgroundColor')); }); 
    });
});

不要使用
#imgRecord
(ID)尝试使用
。imgRecord
(CLASS)这是我第一次尝试修复,但没有成功,这就是我发布此内容的原因。我希望这会很容易。从你发布的内容看不出什么是.grViewer。grViewer脚本是从这里引用的