画像のサイズに基づいてjqueryプラグインを無効にしようとしているので、画像が500x480を超える場合はプラグインを有効にし、画像がそれより低い場合はプラグインを無効にします。
私が試したことはうまくいきません。誰かが私を助けてくれますか?
プラグインのオリジナル機能
$(function(){
$('#zoom1').bind('click',function(){
var cloudZoom = $(this).data('CloudZoom');
cloudZoom.closeZoom();
$.fancybox.open(cloudZoom.getGalleryList());//
return false;
});
});
CloudZoom.quickStart();
私が試したこと、
var img = document.getElementById('#zoom1');
var width = img.naturalWidth;
var height = img.naturalHeight;
$(function(){
$('#zoom1').bind('click',function(){
var cloudZoom = $(this).data('CloudZoom');
cloudZoom.closeZoom();
$.fancybox.open(cloudZoom.getGalleryList());//
return false;
});
});
if(var width > 500 || height > 480) {
CloudZoom.quickStart();//I would like to initiate this.
}
html
<div class="imgwrap">
<div class="sldwrp">
<div class="sldimgwrp">
<?php if($result->num_rows > 0){ if ($row['image_one'] != '') {?>
<img class="cloudzoom appsld" id ="zoom1" src="<?php echo $path.$row['image_one'];?>"
title="Click to view larger image."
data-cloudzoom='
zoomImage:"<?php echo $path.$row['image_one'];?>",
zoomSizeMode: "image",
captionPosition:"top",
maxMagnification:"4"
'><?php }}?>
</div>
<div class="thumbs">
<div class="thumb_img">
<?php if($result->num_rows > 0){ if ($row['image_one'] != '') {?>
<a href="<?php echo $path.$row['image_one'];?>" class="thumb-link">
<img class="cloudzoom-gallery" id="thumbwd" src="<?php echo $path.$row['image_one'];?>"
data-cloudzoom='
useZoom:"#zoom1",
image:"<?php echo $path.$row['image_one'];?>",
zoomImage:"<?php echo $path.$row['image_one'];?>"'>
</a>
<?php }}?>