要するに重要なのは、obj.style.top = ((document.documentElement.scrollTop || document.body.scrollTop)+10) + "px"; です。 これ以上は、IFRAME を初回にロードする時の待機時に、『CSS だけで回る、実行中アイコン』等を実装すればもっといいですね 拡張子:txtvbswsfjsphpjavahtmlutf8sjis <script type="text/javascript"> // ********************************************************* // IFRAME を開く // ********************************************************* function openIframe( ev, strNo, strUrl ) { var obj = document.getElementsByName("iframe" + strNo )[0]; obj.style.top = ((document.documentElement.scrollTop || document.body.scrollTop) + ev.clientY + 10) + "px"; obj.style.left = ( ev.clientX + 200 ) + "px"; var src = obj.src; if ( src + '' == '' ) { obj.src = strUrl; obj.onload = function() { document.getElementsByName("iframe" + strNo )[0].style.display = ""; } } else { obj.style.display = ""; } } // ********************************************************* // IFRAME を閉じる // ********************************************************* function closeIframe( strNo ) { var obj = document.getElementsByName("iframe" + strNo )[0]; obj.style.display = "none"; } </script> 拡張子:txtvbswsfjsphpjavahtmlutf8sjis <iframe name="iframe1" frameborder="1" scrolling="yes" width="500" height="500" style='position:absolute;display:none;' ></iframe> <div style='padding-top:200px;padding-bottom:1000px;'> <input type="button" value="開く" onclick='openIframe(event, "1","http://winofsql.jp")'> <input type="button" value="閉じる" onclick='closeIframe("1")'> </div>
<script type="text/javascript"> // ********************************************************* // IFRAME を開く // ********************************************************* function openIframe( ev, strNo, strUrl ) { var obj = document.getElementsByName("iframe" + strNo )[0]; obj.style.top = ((document.documentElement.scrollTop || document.body.scrollTop) + ev.clientY + 10) + "px"; obj.style.left = ( ev.clientX + 200 ) + "px"; var src = obj.src; if ( src + '' == '' ) { obj.src = strUrl; obj.onload = function() { document.getElementsByName("iframe" + strNo )[0].style.display = ""; } } else { obj.style.display = ""; } } // ********************************************************* // IFRAME を閉じる // ********************************************************* function closeIframe( strNo ) { var obj = document.getElementsByName("iframe" + strNo )[0]; obj.style.display = "none"; } </script>
<iframe name="iframe1" frameborder="1" scrolling="yes" width="500" height="500" style='position:absolute;display:none;' ></iframe> <div style='padding-top:200px;padding-bottom:1000px;'> <input type="button" value="開く" onclick='openIframe(event, "1","http://winofsql.jp")'> <input type="button" value="閉じる" onclick='closeIframe("1")'> </div>