こんにちは、工藤です。 今回は以前まとめたものが古かったので、jQueryを使ったモーダルウィンドウのプラグインを改めてまとめました。 レスポンシブ対応しているもののみに絞っています。 Boxer（Lightbox） DEMO GitHub（Boxer） GitHub（Lightbox） 以前までは『Boxer』というプラグイン単体だったのですが『Formstone』というテーマの1つになり、それに伴い『Lightbox』という名前に変更になったようです。ややこしいです。 ただ比較しても挙動は（見た限りだと）そんなに違わないので好きな方を使ってよいかと思います。 『Boxer』の方が設置は簡単です。 このプラグインのいいところはレスポンシブに対応している、かつスマートフォンで見た場合には最適化して表示してくれるところです。 こんな感じにきれいに表示してくれるので重宝しています。 動画やイン
Hover Slide Effect With the help of this tutorial, you will learn to create a neat effect with some images using jQuery. The idea behind this effect is to have an image area with several images that slide out when we hover over them, revealing other images. The sliding effect will be random. This means that whenever we hover over the images, the other ones will slide in different directions – top,
こんにちは、暑いですね。脇汗すごいですね。僕が。 さて今回はWebページ作成時に、私がよく使っているjQueryプラグインをまとめてみました。（たまにjQueryが必須でないものもあります。） ※紹介しているプラグインを使用する際、ライセンスは各自で再度確認してくださいませ。 Owl Carousel 個人・商用利用可能。レスポンシブでいい感じに動作してくれるカルーセルスライダーです。動作もシンプルで綺麗だし、マークアップも簡単。テキストもOK。お気に入りのプラグインです。 Owl Carousel bxSlider 個人・商用利用可能。シンプルなスライダープラグインです。レスポンシブで動作し、カスタマイズもしやすく重宝します。 jQuery Content Slider | Responsive jQuery Slider | bxSlider Glide.js デモページがカッコイイス
Strengths perfect for hidden page content uber light at just over 1kb (minified) flexible width & height image free multiple instances on one page great for login, sign up & alert panels, etc. How To Use Step 1: together with JQuery, include jquery.leanModal.min.js in your page, thusly: <script type="text/javascript" src="path_to/jquery.leanModal.min.js"></script> Step 2: rather than call another
Custombox is a modern dialog library which is highly configurable and easily styleable. Has a clear and simple API, works on mobile devices, and can be customized to match your style. Overview Check out the some following examples: Simple Fullscreen Loader Custom positions Custom animations Multiple dialogs Non overlay Video
VenoBox 2 Just another jQuery Vanilla JS Lightbox plugin, suitable for Images, Videos, Inline contents, iFrames, Ajax requests. The big difference compared to many others modal-window plugins is that VenoBox calculates the max width of the image displayed and preserves its height if is taller than the window. (so in small devices you can scroll down the content, avoiding vertical microscopic resiz
A basic modal is actually easy to code, and is sometimes more appropriate than a feature-full modal or lightbox plugin. This guide will walk through writing the necessary CSS and JavaScript. See The Demo Drafting the HTML I like to create a rough draft just using HTML and CSS, leaving the scripting for last. I'll write the HTML first to structure the modal, even though the final HTML will be gener
Introduction Slimbox 2 is a 4 KB visual clone of the popular Lightbox 2 script by Lokesh Dhakar, written using the jQuery javascript library. It was designed to be very small, efficient, standards-friendly, fully customizable, more convenient and 100% compatible with the original Lightbox 2. Demo Single images Image set These are pictures I took during a journey through India and Nepal. Features F
Magnific Popup is a responsive lightbox & dialog script with focus on performance and providing best experience for user with any device (for jQuery or Zepto.js). Important note: This jQuery plugin is deprecated, only critical or security bug fixes will be released in future. Use native <dialog> element if you need a basic dialog/modal/popup, or my PhotoSwipe library if you need an advanced image
Fancybox #Fancybox is the ultimate JavaScript lightbox alternative that sets the standard for premium user experience in multimedia display. Supports images, videos, maps, inline content, iframes and any other HTML content. This is the fifth generation of Fancybox. Both Carousel and Panzoom components are used under the hood and that's what makes this project so unique. In addition, Fancybox is ea
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く