今更人に聞けない、jQueryでCSSの操作のやり方。 - Toro_Unit
jQueryがJavascriptのフレームワークとして、ものすごーい普及してますね。 そんなわけで、今更ですが、jQueryでのCSSの操作の仕方。 .css( propertyName, value ) こんな感じ。普通にCSS書くのあんまり変わらないですね。 [js] $(".red").css("background-color","#F00"); [/js] でもこれだと複数プロパティを設定する場合、 [js] $(".red").css("background-color","#F00").css("color","#FFF").css("width","300px"); [/js] となって、読みづらいし、css()を何度も呼んでいるのでいまいち効率が悪い。。。。。 そんなわけで、別の書き方があります。 .css( map ) 変数に連想配列で、CSSのプロパティを渡すことが
#後ろ向きな絵手紙
内海慶一 @pictist 絵はふつうにカボチャとかにして、言葉だけ後ろ向きにするといいと思う。知らずに見た人が二度見する感じで。 2013-09-05 23:50:20
横幅いっぱいのコンテンツスライダーつくりました。 - Toro_Unit
jQueryで横幅いっぱいのコンテンツスライダー、jQuery Full-width Sliderというプラグインをつくりました。 トップページのメインビジュアルとかで使えると思います。というか昔の案件で使ったものをブラッシュアップしたものです。画像以外も使えます。 jquery.fullwidthslider.1.0 デモ:http://demo.torounit.com/fullwidthslider/ 2012-02-09:デモのCSSを修正。IE対応。 デモの写真はFree.Stockerのを使わせて頂いています。良い写真いっぱいありますよねここ。 使い方 js [js] $(function(){ $(".slide").fullWidthSlider({ width:640, height:480 }); }) [/js] html [html] <div class="sli
jQueryでループして画像などコンテンツ要素をスライドさせる無限ループスライダーの作成方法｜BLACKFLAG
Webサイト上でバナーや商品のサムネイル画像などの見せ方として、並べられた画像（コンテンツ要素）を一定のスピードで自動でスライドして、無限ループさせているものをたまに見かけます。 そんなビューアー的役割のコンテンツ無限ループスライダーを作ってみたので紹介してみます。 まずは動作のサンプルから。 jQuery LOOPSLIDER【SAMPLE】 10個並べてある画像が自動でスライドし、無限にループしています。 この動作の全体構成について、HTMLから。 ◆HTML <div id="loopslider"> <ul> <li><a href="#"><img src="img/photo01.jpg" width="100" height="100" alt="" /></a></li> <li><a href="#"><img src="img/photo02.jpg" width="1
2013年上半期に紹介したjQueryプラグイン50選まとめ – bl6.jp
気づいたらあっという間に2013年上半期が終わってしまいましたね。ということで、この間に紹介したjQueryプラグインをまとめてみました。全部でちょうど50個あります。スライダー、ギャラリー、テキスト、ナビゲーションなどいろんなジャンルのプラグインがあるので今後のサイト制作に活かしていきたいですね。レスポンシブ対応のプラグインも増えてきたのも嬉しいですね。 [ads_center] スライダー、カルーセル系 raccordion レスポンシブにも対応しているjQueryプラグインのアコーディオンのイメージスライダー。 raccordion Liquid Slider タブパネルにもなっているレスポンシブなjQueryスライダー。 Liquid Slider jQuery Waterwheel Carousel 水平方向や垂直方向に配置できる水車のようなカルーセル。 jQuery Water
jQueryでシンプルなループスライダーを作る
JavaScriptというかjQueryのお勉強。 練習がてらコンテンツスライダーを作ってみました。 この手のものはチュートリアルもプラグインも山ほどありますが、必要な機能だけあって好きに使えるものが欲しかったので1から作りました。 プラグインをお求めの方は「jQuery.simpleLoopSlider.js」をどうぞ。 欲しかった機能シンプルに動くコンテンツスライダー。ループ機能。最後の次は最初、最初の前は最後、という感じで動く。進む、戻るナビゲーション。自動でページネーションを設置。これをやります。 デモとダウンロードは以下からどうぞ。 jQuery Simple Loop Slider DEMO デモファイルをダウンロード HTMLとCSS<div id="slider"> <div class="slider-view"> <div class="slider-container
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ピュアCSSでコンテンツスライダーを実装できる「Gallery CSS」:phpspot開発日誌