ページ内リンクはスムーズスクロールしなくても一瞬点滅すればいいんじゃないかという実験
スムーズスクロール以外の方法で、ページ内リンクによって画面が切り替わったことを利用者にわかりやすく伝える方法はないかということで、ページ内リンクでの移動時に画面を一瞬点滅させるスクリプトを jQuery で書いてみました。 タイトルが （謎） な感じですが...... ページ内リンクでページ上部に移動させたりするとき、最近は所謂スムーズスクロールってやつを実装するのが当たり前になっていますよね。パッと瞬時に画面が切り替わってしまうと、ページ内で移動したことがわかりにくいので、スクロール処理を入れることでわかりやすくしてあげましょうって言う、親切心から採用されるケースが多いと思います。 実装方法は JavaScript と CSS アニメーションの組み合わせや、JavaScript （というか jQuery） でというのが多いと思いますが、今回はそのスムーズスクロールの実装方法はどれが良いの
テーブルを使ったいろいろなjQueryプラグイン26個まとめ | Web活メモ帳
料金表や一覧を表示する際に欠かせないテーブルコーディングで、検索や並び替え、ページング、グラフ表示など色々なものがあったので、探しやすいようにjQueryプラグインをまとめてみました！ jQuery Visualize HTML5とjQueryを使ってテーブルの値をグラフで表示する事が出来ます。 jquery.csv2table.js エクセルなどで作ったCSVファイルを読み込み、クロスブラウザなテーブル表示を行うjQueryプラグイン。 行の絞り込みや文字列検索などかなり高機能になっています。 jExpand 表、画像、リスト、図やその他の要素を折りたたみ表示する事ができます。 Fixed Header Tables ヘッダーを固定して表示します。Excelでは良く使いますね。 縦に長い表を使う場合に非常に便利です。 treeTable テーブルの中にツリー構造を実装できます。 Flex
テーブル内の行やセルなどの要素をドラッグ＆ドロップで自由に配置できるスクリプト・REDIPS.drag
使い方<script type="text/javascript" src="redips-drag.js"></script> <script type="text/javascript" src="script.js"></script>ライブラリと設定用のjsファイルを読み込んでマークアップするだけです。 デモのマークアップは以下のような感じ。 <div id="drag"> <table> <colgroup> <col width="30"/> <col width="100"/> <col width="100"/> <col width="100"/> <col width="100"/> <col width="100"/> </colgroup> <tbody> <tr> <th colspan="6" class="mark">テーブル</th> </tr> <tr c
jQuery親要素、子要素、兄弟要素取得のまとめ
※各メソッドにかいてある[条件]ってのは、タグ名やid、クラス名を指定するってことです。 条件を入れると、条件にあったものだけが取得されるようになります。 例：$(elem).parent("div.class-name, #id"); 通常のJavaScriptでの要素取得方法は→[JavaScript] 親要素・子要素・兄弟要素の取得方法 ■親要素の取得 □parent([条件]) 親要素の取得。 すぐ上の親要素のみ。さらに上の先祖要素にはさかのぼらない。 $(elem).parent("div"); 親要素がdivだったら親要素が取得できる。divじゃなければ空。 □parents([条件]) parent()と違い親より上の先祖要素までさかのぼる。 $(elem).parents(".class-name"); class-nameというクラス名がついた先祖要素のみ取得 □clos
Literally Canvas — Literally Canvas v0.5.2 docs - HTML5 drawing board - MS Paint in your web browser
Note Looking for a multiuser whiteboard, or want some help building a drawing-based web app? Check out Browserboard. Literally Canvas is an extensible, open source (BSD-licensed), HTML5 drawing widget. Its only dependency is React.js. You can use it to embed drawing boards in web pages. It’s kind of like an extensible MS Paint in JavaScript. Users can sketch drawings and you can do what you like w
Wordpressで郵便番号から住所を自動入力できるようにする。contactform7 ajaxzip3
今回は、お客さまからの要望もあり、お問い合せのページで郵便番号を入力すれば自動的に都道府県、市区町村、町名に入力する方法です。 以前はサーバーに郵便番号のデータベースをアップして、そこから住所を引っ張ってきていたようです。 これだと、市町村の統合などで郵便番号が変わったらデータベースも変更しなくては行けないので面倒でしたが、GoogleさんがAjaxzip3を作ってくれたので、データベースにリンクを貼ればOKとなったようです。 まず、Wordpressではお馴染みのお問い合せ用プラグイン「contact form 7」をインストール、有効化します。 郵便番号と住所の部分だけですが、以下のようにidを付けてcontact form 7のフォームの部分に書きます。 [xhtml] 郵便番号 [text zipcode id:zipcode 10/] 半角数字でご記入下さい 自動的に都道府県、市
jquery小技まとめ３２
作成：2013/07/1 更新：2014/11/01 Web制作 > 先日ECサイトを制作したときに、動きのあるサイトにしないといけなかったので、色々調べて組み込んでみたんですが、jQueryでもう何でも出来ちゃいますね。近い将来ローカルで画像なんかを編集しなくても、ブラウザだけで色々できるようになるんじゃないでしょうか。今回は定番からちょっとマイナー（Google Analytics関係とか）なものまでjQueryの小技、プラグインを集めさせていただきました。 エンジニア速報は Twitter の@commteで配信しています。 もくじ スクロール １．ページ内リンク／フッターまわり／トップに戻る ２．パララックス スライド ３．カルーセル ４．レスポンシブなスライダー ５．ヌルヌルサクサクなスライドメニュー ６．サムネイル付きクロスフェードスライドショー 補助 ７．Google Ana
【jQuery】送信フォームの項目を追加・削除するサンプル - すたら日記
ボタンをクリックすると 入力欄が追加され、右側に『削除ボタン』が付加されます。 入力欄を削除し、1つになったら、削除ボタンは消えます。 デモ: https://codepen.io/sutara79/pen/pZVoaP 『length』プロパティで入力欄の数を把握し、 『.eq()』メソッドで入力欄のinputタグに固有のname属性を振ります。 これで、送信先でそれぞれの入力欄の値を取り出せます。 応用汎用的なjQueryプラグインを作りました。 jquery.addInputArea
jQuery サムネイル連動型の高性能なスライダー【Lof JSliderNews】 – リッチなスライダーの中では一番のお気に入り | Stronghold Archive
jQuery サムネイル連動型の高性能なスライダー【Lof JSliderNews】 – リッチなスライダーの中では一番のお気に入り どうもこんばんは。今回のtipsは【jQuery サムネイルと連動する高性能なスライダー】です。つい最近までリッチなスライダーはFlashでカバーしていましたがこのプラグインを使用すればjQueryで簡単に実装できます。個人的にはシンプルなスライダーにはbxslider、リッチなスライダーにはLofJSliderNews、レスポンシブデザインに使うスライダーはOrbit、それらでカバーできない場合には自作というように使い分けています。 Lof JSliderNews > Download > Demo 実装方法は若干手間ですが、使いこなせばいろいろな所で活用できます。 読み込むファイル <link rel="stylesheet" type="text/cs
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
for文でclick時の動作を定義したい
http://jdtplugins.googlecode.com/svn/trunk/jdtscroll/example.html
DataTables | Javascript table library
dfltweb1.onamae.com – このドメインはお名前.comで取得されています。
jQuery Paint Plugin
Chart.js
finefinefine.jp