私は古いjsポップアップを持つプログラム内で作業しており、それをjQueryモーダルウィンドウに入れようとしています.私が抱えている問題は、imgサイズを取得することです.
これは24時間のデモです
元のスクリプトは次のとおりです。
<script type="text/javascript">
<!--
function newWin(strURL,imgheight,imgwidth) {
var mybar='toolbar=no,directories=no,status=no,menubar=no,resizable=no';
mybar+=',width=';
mybar+=imgwidth;
mybar+=',height=';
mybar+=imgheight;
window.open(strURL, 'newWin', mybar);
}
//-->
</script>
..そして、HTML get は次のように記述されます。
<div id="TMBOBJ7DD361E59F1760" style=" position:absolute; top:201px; left:79px; width:150px; height:96px; z-index:4;" >
<a href="nextpop/imag001A.html" onclick="newWin('nextpop/imag001A.html',408,630);return false;" target="_blank">
<img src="nextpop/imag001.jpg" width=150 height=96 border=0 alt="Mustang">
</a>
</div>
DEMO でわかるように、すべてこの jQuery で変換されるようになりました。
$(document).ready(function() {
$('[id^=TMBOBJ]').each(function() {
var $a = $(this).find('a');
$a.attr('href' , $a.attr('href').replace('html', 'jpg' ));
$a.removeAttr('onclick');
$a.removeAttr('target');
});
$(function () {
var top = Math.max($(window).height() / 2 - $("#large")[0].offsetHeight / 2, 0);
var left = Math.max($(window).width() / 2 - $("#large")[0].offsetWidth / 2, 0);
$("#large").css('top', top + "px");
$("#large").css('left', left + "px");
$("#large").css('position', 'fixed');
});
$('#background').each(function() {
$(this).css('height',$(document).height());
$(this).css('width',$(document).width());
});
$('[id^=TMBOBJ] img').click(function(){
$("#background").css({"opacity" : "0.7"})
.fadeIn("slow");
$("#large").html("<img src='"+$(this).parent().attr("href")+"' alt='"+$(this).attr("alt")+"' /><br/>"+$(this).attr("alt")+"")
.fadeIn("slow");
return false;
});
$("#background").click(function(){
$("#background").fadeOut("slow");
$("#large").fadeOut("slow");
});
$("#large").click(function(){
$("#background").fadeOut("slow");
$("#large").fadeOut("slow");
});
});
imgサイズを取得する方法がわからないことを除けば、私のような初心者にとっては難しいアイデアです。私はこれを試しました:
$("img").load(function(){
var img = document.getElementById('[id^=TMBOBJ]');
var width = img.clientWidth;
var height = img.clientHeight;
});
しかし、元のスクリプトのサイズを取得する必要があるのは私が考えていることですか? 私は知っています...しかし、それは人々のためにwysiwygプログラムを更新するのに役立ちます.