[B! モーダルウインドウ] chihiruのブックマーク

chihiru id:chihiru

モーダルウインドウに関するchihiruのブックマーク (5)

Colorboxの使い方：jQueryで簡単モーダルウインドウ [ホームページ作成] All About
Colorboxの使い方：jQueryで簡単モーダルウインドウjQueryでモーダルウインドウUIを簡単に作れるColorboxの使い方を解説。ウェブページ全面を暗転し、中央に重ねたボックスをモーダルウインドウ風に見せるUIは、Lightbox系jQueryプラグイン「Colorbox」を使えば、ほんの3行程度のJavaScriptを書くだけで作れます。モーダルウインドウ内には、装飾された文章でも画像でも「別HTMLの中身」でも何でも表示できて便利です。モーダルウインドウとはモーダルウインドウとは、何らかの操作をするまで元の画面には戻さないサブウインドウのことです。モーダルウインドウが表示されている間は元の画面にあるUI(ユーザ・インターフェイス)を操作できないので、絶対に何らかの反応(選択や回答など)をしてもらいたい場合や、読み飛ばされると困る情報を表示する際などに使われます。例え
chihiru 2017/06/30
colorbox

web制作

モーダルウインドウ

jquery

JS
リンク
モーダルを簡単に実現させるJavaScript「Reveal」｜skuare.net
twitter facebook hatena google pocket 一度開いたダイアログボックスを閉じるまで、他の操作をできなくするモーダルを簡単に取り入れるJavaScriptReveal: jQuery Modal Plugin from ZURBを紹介します。 sponsors 使用方法 Reveal: jQuery Modal Plugin from ZURBからファイル一式をダウンロード。 <link rel="stylesheet" href="reveal.css" /> <script type="text/javascript" src="jquery-1.6.1.min.js"></script> <script type="text/javascript" src="jquery.reveal.js"></script> <script type="text/
chihiru 2015/07/13
jquery

web制作

モーダルウインドウ
リンク
[JS]操作が気持ちいいさまざまなアニメーションでモーダルウインドウを表示させるスクリプト -animatedModal.js
最近のUIの傾向として、ユーザーが操作して楽しくなるようなアニメーションは大切なポイントです。そんな気持ちいいCSS3のアニメーションでモーダルウインドウをページ全体に表示するjQueryのプラグインを紹介します。横からアニメみたいにひゅっとスライドさせたり、ぼい～んとバウンドさせたり、気持ちよくて面白いものが簡単に実装できます。 animatedModal.js animatedModal.js -GitHub animatedModal.jsのデモ animatedModal.jsの使い方 animatedModal.jsのデモデモでは、3種類のアニメーションを使ったモーダルウインドウを試せます。アニメーションはanimate.cssを利用しているので、80種類以上のエフェクトが利用できます。デモページ：Demo 3 In: bounceIn, Out: bounceOut a
chihiru 2015/03/05
モーダルウインドウ

jquery

JS

web制作
リンク
【jQuery】モーダルウィンドウを実装できるプラグインまとめ
こんにちは、工藤です。モーダルウィンドウについて調べるがあり、いい機会なのでまとめてしまいたいと思います。モーダルウィンドウとは？ちなみにモーダルウィンドウとは図で説明するとこんな感じです。なんとなく見たことがあります・・よね？詳しい事はwikipediaで。 jモーダルウィンドウプラグイン lightbox2 http://lokeshdhakar.com/projects/lightbox2/ モーダルウィンドウと言ったらコレかなと思います。完全に初心者だった時も苦戦せずに設置することができました。シンプルながらエフェクトなども含めてとてもきれいに表示してくれます。 leanModal http://leanmodal.finelysliced.com.au/ テキストのみでただ単にモーダルを使用したい！という時にはこれがおすすめです。すごくシンプルで軽量なプラグインで
chihiru 2014/08/08
Web制作

jquery

JS

モーダルウインドウ
リンク
表示コンテンツの切り替えも出来るシンプルなモーダルウィンドウを実現するjQueryのスクリプト | Web Mugen
シンプルなモーダルウィンドウを制作しました。有名なモーダルウィンドウに比べらたら出来ないことだらけです。画像をグループ化して他の画像へ移動することや、img内のtitleからキャプションを生成、他のHTMLを読み込んでの表示等もできません。その変わり3つのメリットがあります。軽いこと。JSファイルにすると3K以下の軽さであり、画像を必要とせずCSSも普通に記述して20行程の導入のしやすさ。つまり気軽さ。シンプルなこと。見飽きた有名なモーダルウィンドウのインターフェイスに比べて何というシンプルさ、そう閉じるボタンを取り払うほどに。（※閉じるボタンが無くても、グレーバックをクリックすると閉じるコトを認識している人が増えていると、勝手に判断した為です。あとがきでこの事についてチョット書いていますので、興味があれば読んでみて下さい。）表示コンテンツの切り替えができること。コレが本命。とっても
chihiru 2013/11/08
jquery

JS

モーダルウインドウ
リンク
1