Enhance your WordPress page building with Otter Blocks! Create stunning pages without traditional page builders like Elementor and Divi.
※アイコンはNIXUS Icon Packを使わせていただきました。 特徴 iPhoneの特徴的なインタフェースであるフリック操作を、Webサイト上で実現するための jQueryプラグインです。 同じような動作をするプラグインは他にもありますが、このプラグインについては以下のような目的のもとに作りました。 フリック動作のみを実装する 見た目に関連する部分は、なるべく自由にできるようにする その代わりに、拡張しやすいようにする 内部のパラメータに簡単にアクセスできるようにする コールバック関数を用意する iPhone、Androidだけでなく、PCのブラウザ上でも動作させたい IE6でも動いた iPhone、Safari等、CSSアニメーションが使えるものは使う iPhone、Androidの縦持ち・横持ちに対応する 子要素の中にアンカーや画像があっても大丈夫 Macの場合、画像がドラッグさ
jQuery.swapgallerywithdots PCでもスマホでもスワイプできるギャラリー実装プラグイン「jQuery.swapgallerywithdots」。 スマホ用のサイト等でよく見るあのインタフェースをサクっとjQueryで実装するプラグインです。 これさえ知っておけば特別な事はしなくても簡単に実装できるということで覚えておいて良さそう 関連エントリ HTML5＆CSS3なクールでレスポンシブが良い感じのイメージギャラリー実装jQueryプラグイン「least.js」 画像を細長切りにしたオシャレなギャラリーを作れるjQueryプラグイン「Stripte」 Google画像検索っぽい画像ギャラリーが作れるjQueryプラグイン「Superbox」 ギャラリー、スライダー等、複数画像の見せ方を色々提供するjQueryプラグイン「Rondell」 レスポンシブな画像ギャラリーが
Hashslider v2 ハッシュフラグメントでブックマークに対応できるスライダー「Hashslider v2」 http://url/#slide1, http://url/#slide2 のように、スライドが切り替わる度にURLが変わり、そのURLをブックマークすれば、指定したスライドから再生ができるというスライダが実装できます レスポンシブで2,3kbで軽量というのも特徴です。 既存スライダーをつかっていても#対応をするとなると割と面倒であることが想像されるため、こうしたブックマークに対応した機能を使いたい場合は最初から使えるものを選ぶのがよさそうですね。 関連エントリ レスポンシブでタッチ対応な軽量なスライダー実装jQueryプラグイン「Unslider」 前後に移動する際にサムネイルがポップアップされるスライダー実装jQueryプラグイン「PhotoCradle.js」 マスク
デモのアニメーション Gridlyの使い方 Step 1: 外部ファイル 「jquery.js」と当スクリプト・スタイルシートを外部ファイルとして記述します。 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js" type="text/javascript"></script> <script src="javascript/jquery.gridly.js" type="text/javascript"></script> <link href="stylesheets/jquery.gridly.css" rel="stylesheet" type="text/css" /> Step 2: HTML 各パネルはdiv要素で実装し、それらをラッパーで包みます。 <div class=
Add Installation To install download one of these packages and include the jquery.gridly.js and jquery.gridly.css files in your head with the following: <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js" type="text/javascript"></script> <script src="javascript/jquery.gridly.js" type="text/javascript"></script> <link href="stylesheets/jquery.gridly.css" rel="stylesheet"
PureDigital I have a passion and thirst for learning new technologies to keep up-to-date with modern web development. Certified Laravel Developer I fuss over creating software that not only looks and feels great but that are user friendly and adaptable to changing user needs. I’ve been bringing web ideas to life in a planned and managed way since 2009. I'm also a certified Laravel developer by Lar
ちょっと気になったので備忘録。jQueryやMootools、ZeptなどのJavaScriptライブラリとほぼ同じ機能で、且つ軽量なライブラリのようです。一覧表を見る限りでは完全互換では無いようです。 jQueryやMootoolsなどの人気ライブラリと似た機能で、軽量さを追及した、みたいな感じ。バージョンによって多少前後しますけどjQueryが非圧縮で90KB、圧縮して29KBほどなのに対して、Minified.jsは非圧縮でも9KBほど、圧縮版で5KBを切っていますのでかなり軽量と言えそうです。 ライセンスはパブリックドメイン（著作権放棄）なので自由に利用する事が出来るのも大きな特徴です。 軽量でIEにも6から対応しているとの事なので一部の方には需要がありそうです。ちょっとしたDOM操作だけならこんな感じのものでもいいかもしれないですね。 簡易的な物ではありますけど他ライブラリとの機
Scrolling to a spot in an HTML page is pretty simple to do with JQuery, but if you have a lot of IDs on the page to scroll to, the code can get a little messy. This plugin solves that by allowing you to write your anchor tags just as you normally would with the href attribute pointed at the ID you would like to move to (e.g. href="#importantSection".) This means that if JavaScript is turned off, y
The Psychology of Greatness in Legendary AthletesWhat defines greatness in legendary athletes? Beyond physical prowess and skill, their characters, mental resilience, and the ability to inspire transcend their technical achievements. The enduring legacies of individuals like Lionel Messi, Cristiano Ronaldo, Michael Jordan, and Muhammad Ali suggest a deeper interplay of psychological factors and so
「Elastislide – A Responsive jQuery Carousel Plugin | Codrops」の応用版のような感じで、サムネイル部分がカルーセルスライドする、レスボンシブなイメージギャラリーのチュートリアルが公開されていましたので参考に「サンプル」を作ってみました。 レスポンシブな点と沢山の画像を見せるのにかっこいいなぁと思って使ってみましたが、「BorisMoore/jquery-tmpl」を使っていたりで、私には知識不足でよく分からず、コピペして使わせて頂いただけという感じです…。 チュートリアルページ：Responsive Image Gallery with Thumbnail Carousel | Codrops デモ：Responsive Image Gallery チュートリアルページよりデモのファイルもダウンロードできます。 作り方 画像はプレビ
Awkward Showcase is a plugin for the JavaScript Framework jQuery. We call it a Content Slider. But it can do more then just slide the content. For example you can add tooltips, enable thumbnails, activate dynamic height and lots more. Since version 1.0 it’s integrated with our Viewline Plugin enabling new innovative ways for displaying content on your website. Download on BitBucketView Demo
jQueryを使って写真やコンテンツ要素をスライドさせるプラグインは多々ある中、 スライドさせる要素または用途によって、いろいろなパターンでのスライド切り替えが可能になる jQueryコンテンツスライダープラグイン「Awkward Showcase」が便利そうだったのでご紹介。 Awkward Showcase – A jQuery Plugin ≫Awkward Showcase – A jQuery Plugin この「Awkward Showcase」コンテンツスライダーの特徴を「いくつかのすばらしい機能」として チュートリアルページに紹介されている内容として、 —————————————————————————————— ・互換性：すべての主要なブラウザ（Win & Mac用）と互換性がある。 ・キャプション：さまざまなアニメーションと高度な位置決めが可能。 ・ツールチップ：Y/X
A content slider with delayed animations and background parallax effect Default Autoplay Parallax off Easy management Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean. Read more Revolution A small river named Duden flows by their plac
Enhancing Education with Animation Frameworks: Unlocking New Possibilities in Learning Education in the digital age thrives on innovation. Technologies like CSS animation frameworks are transforming the way information is presented, making it more accessible, engaging, and effective. Animation tools have emerged as valuable assets in creating interactive educational content, fostering understandin
Learning Center Chat Twitter GitHub Copyright 2025 OpenJS Foundation and jQuery contributors. All rights reserved. See jQuery License for more information. The OpenJS Foundation has registered trademarks and uses trademarks. For a list of trademarks of the OpenJS Foundation, please see our Trademark Policy and Trademark List. Trademarks and logos not indicated on the list of OpenJS Foundation trad
What is Masonry? Masonry is a JavaScript grid layout library. It works by placing elements in optimal position based on available vertical space, sort of like a mason fitting stones in a wall. You’ve probably seen it in use all over the Internet. Install Download CDN Package managers Getting started HTML CSS Initialize with jQuery Initialize with Vanilla JavaScript Initialize in HTML Next MIT Lice
What is Swipebox ? Swipebox is a jQuery "lightbox" plugin for desktop, mobile and tablet. Main Features Swipe gestures for mobile Keyboard Navigation for desktop CSS transitions with jQuery fallback Retina support for UI icons Easy CSS customization Basic Usage Javascript Include jquery and the swipebox script in your head tags or right before your body closing tag. <script src="lib/jquery-2.0.3.j
Toolbar allows you to quickly create tooltip style toolbars for use in web applications and websites. The toolbar is easily customisable using Font Awesome icons and provides flexibility around the toolbars display and number of icons. A big thanks to the Drunken Parrot UI Kit by Hoarrd for inspiration. Download You can show your appreciation for Toolbar.js and support future development by donati
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
