suffusion-subscription.phpにカスタムコードを追加して、マウスが画像にカーソルを合わせたときにFacebookアイコンの画像を変更しました。
初期ロード中、画像は表示されません。その後、mouseHoverおよびmouseOutイベントは適切な画像を表示しますが、初期ロードでは表示されません。
次の画像は問題を示しています。
JavaScript:
//preload images:
fb1 = new Image(64,64);
fb1.src = "http://sohamshah.com/wordpress/wp-content/themes/suffusion/images/follow/Facebook-04.png";
fb2 = new Image(64,64);
fb2.src = "http://sohamshah.com/wordpress/wp-content/uploads/2011/11/fb-broken.png";
//image swapping function:
function hiLite(imgDocID, imgObjName, comment) {
document.images[imgDocID].src = eval(imgObjName + ".src");
window.status = comment; return true;
}
</script>
HTML:
<div class='fix'>
<a href="http://feeds.feedburner.com/sohamshah" class="follow-icon-and-tag" title="RSS">
<img src="http://sohamshah.com/wordpress/wp-content/themes/suffusion/images/follow/RSS-13.png" alt="RSS" style='width: 64px; height: 64px;' />
</a>
<a href="http://www.facebook.com/soham100" onMouseOver="hiLite('fb','fb2','Follow Me on FaceBook')" onMouseOut="hiLite('fb','fb1','')" class="follow-icon-and-tag" title="Facebook">
<img name="fb" "src="http://sohamshah.com/wordpress/wp-content/themes/suffusion/images/follow/Facebook-04.png" alt="Facebook" style='width: 64px; height: 64px;' />
</a>
<a href="http://twitter.com/sohamshah" class="follow-icon-and-tag" title="Twitter">
<img src="http://sohamshah.com/wordpress/wp-content/themes/suffusion/images/follow/Twitter-08.png" alt="RSS" style='width: 64px; height: 64px;' />
</a>
</div>
この件に関するご協力をいただければ幸いです。
ソハム