スライドショーみたいに1ページずつスクロールするウェブサイトをつくる
スライドショーみたいに1ページずつスクロールするウェブサイトをつくりたく、いろいろ調べた結果、One Page ScrollというjQueryのプラグインを使うことにした。 いまならfullPage.jsだろ？というツッコミを受けそうだけど、そこまで多機能でなくて良いし、なにより軽量でシンプルなほうが良いという人にオススメだ。 One Page ScrollとfullPage.js One Page Scrollは、iPhone5sのようなウェブサイトをつくるために開発されたjQueryプラグインだ。iPhone5sという時点で時代を感じる。 そしてより多機能に、より使いやすくしたのがfullPage.js。 ただ、「スライドショーみたいなウェブサイトがつくりたい」という目的を果たすためだけなら、OnePageScrollで十分だろう。 jquery.fullPage.min.jsが29.
実装簡単！スマホにも対応のセクションスクロールができるスクリプト【Scrollify.js】
section要素やdiv要素が垂直に配置された縦長ページをスクロールしたときに、各セクションを画面のトップ位置にスナップさせるjQueryのプラグイン「Scrollify.js」のオプションなど細かく解説します。 パソコンのホイール操作はもちろん、スマートフォンやタブレットなどのタッチ操作にも対応していて、とても便利です。 また、セクションがウィンドウの表示領域に収まらなくても、セクション内でスクロールができるというのも、魅力の1つです。
jQuery Scrollify - Power steering for your scroll wheel
Basic Setup Scrollify requires jQuery 1.7+. <! doctype html> <html> <head> <script> $(function() { $.scrollify({ section : ".example-classname", }); }); </script> </head> <body> <div class="example-classname"></div> <div class="example-classname"></div> </body> </html> Configuration $.scrollify({ section : "section", sectionName : "section-name", interstitialSection : "", easing: "easeOutExpo", sc
API - jsTree ドキュメント 日本語訳
$.jstree 関数や変数に関連するjstreeの全てを保持しています。実際のクラスやインスタンスに対して作成、接続、操作といった処理を行うメソッドが含まれています。
Drawer
Flexible drawer menu using jQuery, iScroll and CSS. InstallationStep 1: Link required filesDownloadDrawer v3.2.2jQuery 1.11.3+ Created by jQuery Foundation and other contributors.iScroll Created by Matteo Spinelli.CDN<!-- drawer.css --> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/drawer/3.2.2/css/drawer.min.css"> <!-- jquery & iScroll --> <script src="https://ajax.google
carouFredSelで画面横幅いっぱいのスライダーや、レスポンシブスライダーを実装する｜Gimmick log
<div id="slider"> <div id="wrapper"> <ul id="carousel"> <li><a href="#"><img src="../images/main-bnr/01.jpg" width="600" height="300" /></a></li> <li><a href="#"><img src="../images/main-bnr/02.jpg" width="600" height="300" /></a></li> <li><a href="#"><img src="../images/main-bnr/03.jpg" width="600" height="300" /></a></li> <li><a href="#"><img src="../images/main-bnr/04.jpg" width="600" height="3
ツリービューをリストから作成できるjQueryプラグイン、”jsTree”
2016年9月19日2020年5月9日Java Script jsTreeはリスト li 要素をツリービュー形式で表示させるためのjQueryプラグインです。 htmlでliを記述するばかりでなく、jsonデータを読み込んでツリーを動的に作成することもできます。 普通にツリー表示させてアイコンを変更する程度なら簡単にできるので、メモがてらやり方を書いておきます。 ハマった時のポイントうまくいかない時は ' シングルクオーテーション と " ダブルクオーテーションを確認して下さい。プロパティは json と同じく “ ダブルクオーテーションでくくらないとだめ。必然的に波カッコは ' シングルクオーテーションでくくることになります。
jstree
jsTree is jquery plugin, that provides interactive trees. It is absolutely free, open source and distributed under the MIT license. jsTree is easily extendable, themable and configurable, it supports HTML & JSON data sources and AJAX loading. jsTree functions properly in either box-model (content-box or border-box), can be loaded as an AMD module, and has a built in mobile theme for responsive des
Lightbox
Getting started Download a zip of the latest release (or any previous one) from the Github Releases page. Or install using npm: npm install lightbox2 --save Open up the zip file and take a peek at the barebones, working example that is included in the /examples folder. Ready to set Lightbox up on your page? Start by including the Lightbox CSS and Javascript. You can grab both these files from the
scrollnav.js
A small, dependency free JavaScript plugin for auto generating and tracking single page navigation (aka a Table of Contents) Get started View the demos Features Simple setup Pass your page’s content to scrollnav and it will generate the navigation and track scrolling automatically. Fully customizable All the styling is up to you, make scrollnav look and behave however works best for your project.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
jsTreeのJSONデータを変えたい。
GitHub - humaan/Modaal: An accessible dialog window library for all humans.
GitHub - artberri/sidr: Sidr is a jQuery plugin for creating side menus and the easiest way for doing your menu responsive.
GitHub - CodeSeven/toastr: Simple javascript toast notifications
タイプライターアニメーションエフェクト実装「jQuery.Hypertext.Typewriter」:phpspot開発日誌
テキストを部分的にアニメーションしながら交換できる「jQuery Text Rotator」:phpspot開発日誌
モダンなデザインでウィザードを作れる「wizzy」:phpspot開発日誌
リストから必要な物を選ぶUIを実現する「jQuery.SelectListActions」:phpspot開発日誌
巨大データでも高速に動作する「jquery.dgtable」:phpspot開発日誌
特定のDOMを指定して印刷することが出来るボタン「printThis」:phpspot開発日誌