It’s been a long time since we did a major release, and you certainly deserve one. So we’re glad to announce the first alpha of jQuery 3.0! Despite the 3.0 version number, we anticipate that these releases shouldn’t be too much trouble when it comes to upgrading existing code. Yes, there are a few breaking changes that justified the major version bump, but we’re hopeful these breakages don’t actua
Index of Semooh jQuery Sample Site 画像 1.画像を切り替える（フェード） 2.画像を切り替える（フェード2） 3.画像を切り替える（サイズ、フェード） 4.画像を切り替える（スライド） 5.画像を切り替える（奥行き） 6.画像を切り替える（サイコロ） 7.画像を切り替える（シャッター） 8.画像を切り替える（カルーセル） 9.画像を切り替える（色々） 10.画像の一部分を拡大する 11.縮小した全景で画像を見る 12.画像をパノラマ風に表示する 13.画像を反射する 14.LightBoxを表示する 15.画像にマスク処理を施す 16.マウスオーバーで画像を拡大表示する 17.透過PNGをIE6でも表示させる スタイル 1.マーキーを滑らかに実装する 2.クリックできる範囲を広げる 3.要素の高さを最大のものに揃える 4.グラデーションを作成する 5.文
JavaScript Animation Speed Test Compare the performance of various JavaScript libraries with GSAP. This test simply animates the left, top, width, and height css properties of standard image elements. There are also versions of several of the tests that use transforms ("translate/scale") instead so that you can compare performance. The goal was to be extremely fair and use the same code for everyt
索引 └ サンプル目次 1章：短編集 ├ スイッチの作成 ├ キャプションの表示 ├ スムーススクロール(1) ├ スムーススクロール(2) ├ タブメニュー(1) ├ タブメニュー(2) ├ タブメニュー(3) ├ タブメニュー(4) ├ カテゴリ切替(1) ├ カテゴリ切替(2) └ カテゴリ切替(3) 2章：診断系コンテンツ ├ 選択肢の作成(1) ├ 選択肢の作成(2) ├ 選択肢の作成(3) ├ 質問の切替(1) ├ 質問の切替(2) ├ 点数計算 ├ 結果の表示 ├ 外部テキストの読込 └ もう一度ボタン 3章：製品抽出系コンテンツ ├ 構成の確認 ├ 回答の確認 ├ 点数表の作成 ├ 得点の集計(1) ├ 得点の集計(2) ├ 結果画面の作成(1) └ 結果画面の作成(2) 番外：Simulation Game ├ 地形データの読込 ├ ユニットの移動 ├ 敵ユニットの扱い
ViewerDecember 9 Viewew is an awesome jQuery image viewing plugin for photo galleries. Created by Fengyuan Chen Download Home Example View more → video-extendDecember 7 Video Extend is a jQuery plugin to create advanced video controls like jump to and chapters to videos Created by andchir Download Home Example View more → Casino pagination-jsDecember 5 Pagination-js is a Casino ohne Steuer jQuery
●表示されてからアニメ 今回はanime.jsの勉強ではありませんが、内容的には前回の続きです。 前回作成した文字アニメは表示されてから開始するようにしたいです。cssの追加/削除で完結する場合は以下のライブラリが便利だと思います。しかし今回はanime.jsを利用するので、ビューポートに入ったら指定のfunctionを実行する部分を自作しようと思います。 →参考：要素がビューポートに表示されたか判定する -Emergence.js ●各種パラメータの取得 まずは表示している要素のY座標とスクロールしたときの表示範囲（Y座標）を取得しました。 まずアニメさせたい要素（今回はclass属性がanimeText）のY座標を以下のように取得しています。scrollTopの位置はブラウザによって書き方が変わるのが少し面倒です。 var elms = document.querySelectorAl
告知： 本アプリは2016年6月末日にストア（iOS/Android）から削除する予定です。復習サイトは弊社が存続する限り残す予定です。 理由： Webサイト「jQuery入門講座」の運営よりも「ゲーム制作に注力」していくためです。アプリのバージョンアップも予定していません。あまりアプリが売れなかった...というのもあります。 jQueryの全てのメソッドやセレクタの構文を正確に覚える必要はありません。しかし、どの様な機能のメソッドやセレクタがあるのかを把握しておくのは大切です。jQueryを俯瞰できるように、このアプリをご活用下さい。 jQueryのソースを記述する際に正確な構文を調べる場合はリファレンスページを活用すればよいのです。しかしjQueryが、どの様な機能を持っているかを把握していなかったら効率の良い記述はできません。なので、大まかでもjQueryの全体像を把握しておくことが
知っている人には当たり前のことかもしれませんが、使い方をまとめておきます。 jQuery.extend() は、基本的には複数のオブジェクトをマージして返してくれるメソッドです。 (プラグインのソースで、デフォルトの設定値を上書きする時などによく見かけますね） jQuery.extend(target[, object1][, objectN]) こんな感じで使います。 オブジェクト a の内容と b の内容をマージしたいとき、 var a = { id: 1, name: 'TAM' }; var b = { name: 'TAM-new', hobby: 'football' }; $.extend(a, b); console.log(a); // 結果: // { // id: 1, // name: "TAM-new", // hobby: "football" // } $.e
by Michael Eisenbraun Columns is an easy way of creating JSON data into HTML tables that are sortable, searchable, and paginating. All you need is to provide the data, and Columns will do the rest. Installation Include the jQuery Library 1.7 or later and Columns Plugin File: <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script src="js/jquery.columns.min
HTMLのテーブル表示は色々な場面で使われます。ですが単に表示するだけで満足するケースは少なく、テーブル内のデータをもっとインタラクティブに変更したいと言う要望は多々聞きます。 そこで使ってみたいのが今回紹介するjQuery Dynatableです。そもそもHTMLのテーブルを描画するのではなく、JSONデータを使って動的にレンダリングします。その結果、面白いデータ操作が色々と実現できています。 早速見ていきましょう。 デモです。表示件数、ページネーション、フィルタリングといった機能が実装されています。 表示件数を変えれば動的に内容が変更されます。 フィルタリングもインタラクティブに行われます。 JSONからだけでなく、動的にテーブルを生成できます。例えば以下のコードはリストから読み取ってテーブルを生成します。 <ul id="my-list"> <li> <span class="nam
非常に高機能で便利なJavaScriptライブラリとして評判の「jQuery」をちょっと触ってみた。 jQuery Pluginが豊富に存在する、というのも人気の理由のようで。 formの入力チェックをしてくれる「Validation Plugin」というものを使って試してみた。 bassistance.de » jQuery plugin: Validation 忘れてしまわないうちにメモっておこう。 最も簡単なサンプル それぞれ上記リンクからダウンロードして、「js」というディレクトリに放り込んでおいた。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>title</title> <script type="te
To get started, simply install jquery.dynatable.js (along with jQuery), and add the following in the document.ready or after the table: Read / Normalize The HTML table is scanned and normalized into an array of JSON objects (or collection) where each JSON object (or record) corresponds to a row in the table. Operate The JSON collection can be sorted, searched/filtered, and paginated/sliced. Write
Bellows ? Responsive, Mobile-First Accordion UI Module | Mobify モバイルファーストでレスポンシブなアコーディオン実装「Bellows」 次のようなシンプルでスッキリしたデザインのアコーディオン実装が出来ます。 関連エントリ レスポンシブで何でも埋め込めるLightBox実装jQueryプラグイン「VenoBox」 レスポンシブなタブを実装できるjQueryプラグイン「Responsive-Tabs」 フラットでレスポンシブなギャラリー実装jQueryプラグイン「lightGallery」 レスポンシブで軽量なLightBox実装「Rebox」
こんにちは。荒井です。 Facebookもtwitterもgoogleも画面遷移のときには、非同期で次のページを読み込むような作りになってますね！ これは、ajaxで次のページを読み込むのと同時に「History API」というHTML5の機能を使って、URLを更新することで実現してます。 毎回全部読み直さないから通常の画面遷移よりも早いし、URLが変わるから履歴に残るし、良いことばっかり！！SEO的にも「#!」を使ったやつより良いよっていうのを何かで読みました！！！ これからWebサービスを作るなら、導入したいですね！！！ これpjaxを使えば簡単に導入できるんです！！！よし！！！ PJAX!! pjaxとは、GithubのChris Wanstrathって人が作ってるjqueryプラグインです。 上で説明した、History APIとajaxを使った非同期の画面遷移を簡単に導入すること
アンカーを URL に表示させるとソーシャルブックマークや Twitter などで集計する際に同じページが別なものとして扱われる可能性がある。jQuery: Smooth Scrolling Internal Anchor Links で示されている短いコードは event.preventDefault() を使うことでアンカーの表示を防いでいる。 $(function() { $(".scroll").click(function(event){ event.preventDefault(); $('html,body').animate({ scrollTop:$(this.hash).offset().top }, "fast"); }); });
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
