以下のソースは、fancyboxのデモページを、わたしの用途に合うように切り出したものです。
こちらの記事の付属物です。
元のファイルは
fancybox.net様が配布しているfancyboxに添付されている、デモページのhtmlファイルです。
本体および正しいデモファイル、詳しく正確な情報については、そちらへ。
<!DOCTYPE html>
<html>
<head>
<title>cut to fancyBox Demonstration</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!-- Add jQuery library -->
<script type="text/javascript" src="mods/fancybox/lib/jquery-1.10.1.min.js"></script>
<!-- Add mousewheel plugin (this is optional) -->
<script type="text/javascript" src="mods/fancybox/lib/jquery.mousewheel-3.0.6.pack.js"></script>
<!-- Add fancyBox main JS and CSS files -->
<script type="text/javascript" src="mods/fancybox/source/jquery.fancybox.js?v=2.1.5"></script>
<link rel="stylesheet" type="text/css" href="mods/fancybox/source/jquery.fancybox.css?v=2.1.5" media="screen" />
<!-- Add Button helper (this is optional) -->
<link rel="stylesheet" type="text/css" href="mods/fancybox/source/helpers/jquery.fancybox-buttons.css?v=1.0.5" />
<script type="text/javascript" src="mods/fancybox/source/helpers/jquery.fancybox-buttons.js?v=1.0.5"></script>
<!-- Add Thumbnail helper (this is optional) -->
<link rel="stylesheet" type="text/css" href="mods/fancybox/source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" />
<script type="text/javascript" src="mods/fancybox/source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>
<!-- Add Media helper (this is optional) -->
<script type="text/javascript" src="mods/fancybox/source/helpers/jquery.fancybox-media.js?v=1.0.6"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".fancybox_iframe").click(function() {
$.fancybox.open({
href : 'iframe.php',
type : 'iframe',
padding : 5
});
});
});
</script>
</head>
<body>
<a class="fancybox_iframe" href="javascript:;">
Open single item, custom options
</a>
</body>
</html>
ノートPCの液晶保護フィルムが100円で買えるなんて、良い時代になりました。 ダイソーに行ったら、ノートPCで使えそうな液晶保護フィルムがあったため、衝動的に購入。 A4サイズと書いてあります。私が使っている13インチワイドのノートPCで使えるかどうかわからなかっ...
ファイルを開くダイアログならともかく、Itemの回転ダイアログなどは画面に被っていると、編集対象が隠れてダイアログ操作しずらくなってしまいます。 そこでモーダルダイアログ をドラッグで移動できるようにする必要があります。 HTMLのダイアログの場合、ドラッグ可能にするにはJSが...
0 件のコメント:
コメントを投稿