JQuery lightSlider
JQuery lightSlider JQuery lightSlider is a lightweight responsive Content slider with carousel thumbnails navigation Main Features Fully responsive - will adapt to any device. Separate settings per breakpoint. Gallery mode to create an image slideshow with thumbnails Supports swipe and mouseDrag Add or remove slides dynamically. Small file size, fully themed, simple to implement. CSS transitions w
HTML5 Image upload width drag and drop, crop and ratio
HTML 5 Image upload uses the feature of HTML 5 and file handling. The requirments for using this tool are jQuery 1.9.x or higher and the use of Twitter Bootstrap. Download this plugin at Code Canyon! Basic usage The basic usage of the HTML 5 Image upload is to write the HTML code below and assign the JavaScript class to the element. The code can be used on a single element as well as multiple elem
jquery 1.xと2.x の違い、さらに動作を高速にするための設定 | まとめーたー
photoBy: http://www.jose-aguilar.com/blog/wp-content/uploa…まずは jquery 1.x と 2.x の違い 1.x 系は IE8 以前をサポートするが遅い、重い 2.x 系は IE8 以前のサポートは捨てて、いるが軽い、早い アイルトン・セナじゃあるまいしそんなに早くしてどうすんの？Webページがたった1秒高速化するだけでECサイトなんか、売上が10％向上した事例もあります。 使い分ける対応していないIE8以下には古いjqueryを読み込ませます <!--[if lt IE 9]> <script src="jquery-1.9.1.js"></script> <![endif]--> <!--[if gte IE 9]><!--> <script src="jquery-2.0.0.js"></script> <script s
マイクロテンプレートエンジン jQuery Tempura | それなりブログ
jQuery Tempura は jQuery 依存の簡単な Templating Engine です。 この記事のものや jQeury Plugin Registry などを調べたのですが、 自分の要望を満たすものが無いので、オレオレにしちゃいました。 普通のHTMLファイルの上から、正しいHTMLを維持したまま使える {{foo}} や <%= foo %> といったテンプレ変数を埋め込まなくて良い。AngularJS のようにHTML属性値でテンプレ変数とリンクする。 これは一言で言えば「HTMLがまんま残るのは良いことだ」という利点であるが、「別のテンプレートエンジンと併用が可能」という側面もある。 必要な部分だけを更新する 更新の度に、テンプレ全体を再生成しない。 テンプレ変数が足りなくても空白になったりしない、前の状態が残る。 なので、イベントハンドラを生かし易い。大体のケース
jquery.dependent.jsを修正した - Diary::Naaaaari
Webサイトの住所の登録フォームとかで、parent-childで依存しているプルダウンとかありますよね。それをjqueryでさくっと実装できるプラグインがjquery.dependent.jsなんです。 参考:http://www.skuare.net/2009/12/selectjavascriptdependent_sele.html jsやjqueryがさっぱりな自分にも使いこなせるくらい簡単なんですが、 サポートが終わってしまったのかjquery-1.3.2以降辺りから動かない。 他の方法もあるんだけれども、templateの事情もあり、出来ればこいつで実装したいなってことで、分からないながらもソースを見ることにした。 問題がありそうだったのは、child要素を作る際の部分だったのでそのあたりをちょこちょこ変えながら動かすとtextがとれていない。 というわけで以下を変更。 -
jQuery Tag-it!
Simple and configurable tag editing widget with autocomplete support. Source code is available at Github. Actual extensible and idiomatic jQuery UI widget. The widget can be styled using Themeroller or any premade jQuery UI theme. Works with jQuery UI Bootstrap Degrades gracefully for browsers without JavaScript (see example). Demo Tags: See more examples of different configuations. Need help? See
スマホサイトにおすすめ。jQueryプラグイン『PageSlide』を使ってFacebook風メニューを再現してみました
こちらもおすすめです！(2013.08.27)→『ヌルヌルの秘訣はCSS！Googleスマホ版で採用されている使い心地のよいスライドメニューを再現した『jSlideMenu』 』 こんにちは、霙（@xxmiz0rexx）です。 スマートフォンサイトでのメニューの表示方法をあれこれ考えた結果、素敵なjQueryプラグインに辿り着きましたのでご紹介したいと思います。 コンテンツ量が多くてもメニュー分のスペースを考えずに構成できるのでかなり気に入っています :) FacebookやPathなどで使われているあのメニュー表示の動きをjQueryで簡単に再現できるプラグインです。 普段はCSSで非表示にしておいて、ボタンを押した時に┃＼( °Д°)三ｶﾞﾗｯと引き戸を開けたようにメニューが出現しますｗ ＊追記＊ ライセンスはMITなので商用サイトでも使用OKです！ 参考：PageSlide: a j
チェックしたチェックボックスの背景の色を変更する
Result jQuery//チェックが入ってるのは背景色追加 $(":checked").parent().css("background","#f3f365"); //クリックイベント発火 $("input").click(function(e) { var t = e.target.type; var chk = $(this).prop('checked'); var name = $(this).attr('name'); チェックが入ったか入ってないかで条件分岐 if(t == 'checkbox') { if(chk == true){ $(this).parent().css('background', '#f3f365'); } else { $(this).parent().css('background-color', ''); } return true; //ラジ
jQueryでマウスオーバーしたテーブル行(tr要素)をハイライトさせる方法 | 1bit::memo
仕事ですごく縦長の表を作ることになり、似たような内容が並ぶため、今自分がどこを見ているのかが分からなくなる事があったので実装した時のメモ。 確認環境 jQuery1.7.1 htmlコード 以下のようなテーブルがあるとします。jQueryの読み込みなどは省略していますので、適宜記述してください。 <table class="hoge"> <tr> <th>見出し</th> <th>見出し</th> <th>見出し</th> </tr> <tr> <td>内容</td> <td>内容</td> <td>内容</td> </tr> <tr> <td>内容</td> <td>内容</td> <td>内容</td> </tr> </table> jQueryコード jQueryでは、対象となるtr要素をマウスオーバーしたら、trにクラスhvを振り、マウスアウトしたらhvを削除するという、シンプルな
jQueryで背景画像をフルスクリーン表示してスライドショーに出来るやつ色々 - かちびと.net
気が向いたのでメモ。背景に配置した 画像をフルスクリーンで表示して、更 にスライドショー化できるjQueryのプ ラグインとか。さほど数は無いですけ ど・・・使う可能性があるかもなので 備忘録的にまとめておきます。 タイトル考えるの結構面倒くさいので適当になってきました。語彙が中学生レベルですが気にしないで下さい。 さて、フルスクリーンにした背景をスライドに出来るjQueryいろいろです。ほぼ択一っちゃ択一なんですけど・・・ちょっと出来上がりすぎていじりにくいので他もチェックしたい、という事で調べたものを羅列しておきます。触ったこと無いのもあるのでその程度の記事という事で。 Supersized 定番の高機能プラグインです。IE6では動作しません。スマートフォンでも大丈夫っぽい。多数のオプションも用意されており、FlickrAPIにも対応してるくさいです。ライセンスはMIT/GPLのデュア
jQueryで全画面表示するギャラリーを作るチュートリアル
jQueryで全画面表示するギャラリーを作るチュートリアル 最近はFlashで作ったのかと思ってしまうようなjavascriptなギャラリーをちらほら見るようになりましたね。 この記事ではあまり凝ったことをすると大変、、というか作れるスキルがないので、jQueryを使用したシンプルなフル画面ギャラリーの作成方法をチュートリアル形式でお送りいたします。 投稿日2011年04月28日 更新日2011年04月28日 画像の準備をしよう ギャラリーページなので当然のことながら画像は準備しておきましょう。 小さい画像（サムネイル）と大きい画像を用意します。 小さい画像は100×67、大きい画像は画面いっぱいに表示するのでそこそこ大きいのにします。 画像サイズが変わっても基本的にcssを修正するだけで済むようにします。 html + cssを作成しよう 連番画像をjQueryで配置しても良かったのです
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTML/SELECTカスタマイズ