外部調用jQuery擴展函數

我有一個jQuery擴展，我寫比較2圖像。我把它稱爲「控制圖像」，使用以下內容：外部調用jQuery擴展函數

currentCompare = jQuery('#controlImage').imageZoomCompare({ 
    ...options.... 
})

擴展的工作方式與我打算的完全一樣。擴展名內部是一個名爲magnifyImage的函數。我想爲查看鼠標上沒有滾輪的工具的人添加滑塊。所以，我有以下HTML5滑塊代碼：

<input type="range" id="imageZoomLevel" name="imageZoomLevel" min="2" max="10" value="2" onchange="javascript:switchZoom(this.value)" />

的目標是當用戶移動滑塊，在「#controlImage」主動選擇imageZoomCompare內magnifyImage功能會增加，相應減少。我不理解我是如何通過文檔完成這項工作的，並且希望能夠朝正確的方向發展。

小提琴：http://jsfiddle.net/d3xt3r/YeP4Y/

來源

2013-04-17 Dexter

ü可以粘貼到jsfiddle.net的magnifyexternal（）方法？會更好... –

我已經取得了滑塊的目標：

的jsfiddle：http://jsfiddle.net/YeP4Y/5/

起跑線230：

magnifyexternal: function($tracker, newpower, zoomRange) 
{ 
    var specs=$tracker.data('specs') 
    //alert(JSON.stringify(specs)); 
    var magnifier=specs.magnifier, od=specs.imagesize, power=specs.curpower 
    var magnifier2=specs.magnifier2, od=specs.imagesize, power=specs.curpower 
    var nd=[od.w*newpower, od.h*newpower] //calculate dimensions of new enlarged image within magnifier 
    magnifier.$image.css({width:nd[0], height:nd[1]}); 
    magnifier2.$image.css({width:nd[0], height:nd[1]}); 
    //alert(JSON.stringify({width:nd[0], height:nd[1]})); 
    specs.curpower=newpower //set current power to new power after magnification 
    specs.$statusdiv.html('Current Zoom: '+specs.curpower); 

    jQuery("input:radio[name=radioZoomLevel][value="+newpower+"]").attr('checked', true); 

    this.showstatusdiv(specs, 0, 500); 
    $tracker.trigger('mousemove'); 
},

圍繞線402：

$("#imageZoomLevel").bind('change', function(){ 
fiz.magnifyexternal($tracker,$(this).val(), setting.zoomRange) 
});

這不完全是你想要的（因爲它不是綁定在外部，只在內部），但它的工作原理。

也使其外部工作，我會做到以下幾點：。

找到一種方法來抓住插件的實例（例如，通過調用$（「選擇」）imageZoomCompare（「得到」）
呼叫這種情況下

來源

2013-04-17 14:24:17 MythThrazz

外部調用jQuery擴展函數

回答

相關問題