<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<script type="text/javascript"> $(function() { $('#open1').click(function() { $("#mado1").ipop(); } ); $('#open2').click(function() {$("#mado2").ipop();} ); }); </script> <style type="text/css"> .ipop { padding: 0; background-color: #fed; width: 300px; height: 200px; border: 1px solid #aaa; /* この3行は必須 */ position: absolute; display: none; z-index: 9999; } .ipop_title { background-color: #fdc; cursor: move; } .ipop_close { cursor: pointer; float: right; } </style> <title>ポップアップウインドウテスト</title> </head> <body><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="./test013.js"></script>
<a href="#" id="open1">窓1開く</a>
<a href="#" id="open2">窓2開く</a>
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
(function($) {
$.fn.ipop = function() {
var $this = $(this); var wx, wy; // ウインドウの左上座標 var mx, my; // マウスの座標 // ウインドウの座標を画面中央にする。 wx = $(document).scrollLeft() + ($(window).width() - $(this).outerWidth()) / 2; if (wx < 0) wx = 0; wy = $(document).scrollTop() + ($(window).height() - $(this).outerHeight()) / 2; if (wy < 0) wy = 0; // ポップアップウインドウを表示する。 $this.css('top', wy).css('left', wx).fadeIn(100); // 閉じるボタンを押したとき $this.find('.ipop_close').click(function(){ $this.fadeOut(100);}); // タイトルバーをドラッグしたとき $this.find('.ipop_title').mousedown(function(e) { mx = e.pageX; my = e.pageY; $(document).mousemove(mouseMove).mouseup(mouseUp); return false; }); function mouseMove(e) { wx += e.pageX - mx; wy += e.pageY - my; $this.css('top', wy).css('left', wx); mx = e.pageX; my = e.pageY; return false; } function mouseUp() { $(document).unbind('mousemove', mouseMove).unbind('mouseup', mouseUp); } }
})(jQuery);
リンクタグだと動くのですが、inputタグのボタンだと動きません。
大変恐縮ですが、どうすれば動くのかを教えて頂けないでしょうか。
また、ツールバー&メニューバーの検知についても質問を出しております。
どなたか分かるかようでしたらご回答頂きますようお願い申し上げます。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
退会済みユーザー
2015/06/05 09:31