虽然有很多线程处理 FadeIn/FadeOut,但我相信我在使用这些有些独特的功能时遇到了问题。我很难相信它可能是带宽,但如果它在@localhost 上完美运行并且在网上不太好(10mbs 帐户@Comcast),那么我不太确定该怎么做。
好的。简而言之,数据库通过 PHP gd_library 提供了一堆缩略图。有一个带有 id="placeholder" 的 450px 占位符图像的 div
<p class="placeholderContainer"><img id="placeholder"
src="product_getimage.php?path='.$path.'&size='.$size.'" border="0" alt="" /></p>
大拇指以这种形式被循环吐出
<a href="../images/products/'.$catNAME.'/'.$imgLOC.'/'.$imgName.'"
title="'.$imgTitle.'"><img src="product_getimage.php?path='.$pathT.'&
amp;size='.$sizeT.'" border="1" id="'.$imgName.'" alt="" /></a>
所有非常简单的东西。你可以在@transparentcable.com 看到它。单击产品按钮,然后单击音频电缆。左侧边栏是链接列表。单击其中任何一个,产品将加载到上述配置中。
现在这里是用于在拇指上运行简单点击事件的 jquery(在源代码中就可以了)
$(document).ready(function() {
$('#prod-thumbs a img').click(function() {
var selImg = $(this).attr('id');
var imagePath = "../images/products/<?php echo strtolower($catNAME);?>/<?php echo
$imgLOC; ?>/";
var finalImg = imagePath + '/' + selImg;
$('img#placeholder').fadeOut(500, function() {
$('#placeholder').fadeIn(300).attr({src:finalImg});
});
return false;
});
});
从本质上讲,它只是多年前更改图像 src 的旧 javascript 图像交换的一种变体。这里也一样。
除了,在这种情况下,fadeOut 做了它的事情,但占位符图像仍然存在,然后当 fadeIn 函数运行时它很快被替换。就像我说的,在 WAMP 系统上的办公室里工作完美,但在网上有那个讨厌的小绊脚石。
源代码中的所有内容都非常可见,欢迎提出任何建议。