画像拡大-jQueryスクリプト使用異常:画像の外枠のみをフラッシュ表示
1450 ワード
:
$(function(){
$(".tooltip").mouseover(function(e){
var imagePath=$(this).attr("src");
var $div=$("<div id='temp'><img src='imagePath' style='width:240px;height:320'></div>");
$("#book_list").append($div);
$div.css("position","absolute")
$div.css("left",e.pageX)
$div.css("top",e.pageY)
$div.show();
}).mouseout(function(){
$("#temp").remove();
});
});
異常原因:
スクリプト文字列の使用に問題があり、imagePathをscrの単一引用符に直接置くべきではありませんが、火狐ブラウザにはエラー異常はなく、jsでstyleスタイルを使用できないと誤解し、後で考えても不可能で矛盾しています.
var $div=$("<div id='temp'><img src='imagePath' style='width:240px;height:320'></div>");
解決:
方法1:
ソフトウェアで画像を拡大し、imgリンクを拡大した画像名に向ける
var $div=$("<div id='temp'><img src='"+imagePath.substring(0,imagePath.lastIndexOf("\."))+"_big.jpg"+"'/></div>");
方式2:スタイルで画像を拡大しますが、スペルスクリプトの書き方に注意してください.変数imagePathはsrcの引用符に直接置くことはできません.「+」記号でスペルする必要があります.スペルについてはSQLの使用過程でもよく使われています.
var $div=$("");