タグ

2012年2月22日のブックマーク (5件)

  • クライアントワークでよくお世話になっているjQueryプラグインいろいろ

    私が仕事Web制作をする時に、よく利用させてもらっている jQuery のプラグインをまとめてみました。ライセンスは MIT、GPL のものばかりです。デザイン、レイアウト的に汎用性のあるものになっています。また、IE 特有のバグ(透過PNGの黒ずみなど)対策についても少し触れてみました。 Webサイトを作る時に、何かとお世話になっている jQuery のプラグイン。HTMLCSS だけでは表現できないことも、Javascript を使うことでいろいろできるようになりますよね!インターネットを見ていると、当にたくさんの jQuery のプラグインが公開されています。feed を読んでいても、1日一個くらいは新しい jQuery のプラグインに出会います。どれを使ったらいいか迷うくらい … 。 今回は、そんな数ある jQuery のプラグインの中から、 私がクライアントワーク(仕

  • 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

    jQueryでループして画像などコンテンツ要素をスライドさせる無限ループスライダーの作成方法|BLACKFLAG
  • 横幅いっぱいのコンテンツスライダーつくりました。 - 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

    横幅いっぱいのコンテンツスライダーつくりました。 - Toro_Unit
  • 少しのコードで実装可能な15のスマートフォンサイト用小技集

    少しのコードで実装可能な15のスマートフォンサイト用小技集スマートフォンが普及してきて、Webサイトを作る時、スマートフォンサイトも一緒に制作している方も多くなってきていると思います。私もスマホサイトを制作する機会が増え、だんだんEvernoteに保存していたスマートフォンサイトを作る時の小技がたまってきたので、iPhoneで使える小技を中心にまとめて記事にしてみます。いくつかサンプルも作っているので、スマートフォンからあわせてご覧下さい! スマートフォンサイト用小技集 目次いくつかサンプルも作ったのでスマートフォンから、もしくはブラウザーからユーザーエージェントを iPhone などに切り替えてご覧ください! 横幅をデバイスの幅にあわせる文字サイズの自動調整をオフリストのクリック(タップ)範囲を広げる画面の幅にあわせて CSS を変えるリンクテキストのある Div 全体をクリック(タップ

    少しのコードで実装可能な15のスマートフォンサイト用小技集
  • 【Fireworks】 テキストボックスを改行で分割するコマンド | バシャログ。

    髪を切って2日目で失敗したことに気がついたminamiです。 今回もちょっとだけ便利なFireworksのコマンドです。 テキストボックスを改行で分割するコマンド 右クリックなどで保存してください。ご使用は自己責任でお願いいたします。 読んで字のとおりですが、テキストボックスを改行部分で複数のテキストボックスに分割してくれるコマンドです。 画面をデザインをする際に、テキストを原稿からパーツにわけて一つづつコピペ・・・がめんどくさかったので作りました。 使い方 テキストボックスを選択して、「コマンド→スクリプトを実行」でスクリプトのファイルを選択して実行するだけです。改行でテキストボックスに分割されます。複数のテキストボックスを選択して実行するとそれぞれ分割されますが、テキストボックス以外のオブジェクトを含めるとそのオブジェクトが消えてしまうので注意してください。 作ってみてわかったこと v

    【Fireworks】 テキストボックスを改行で分割するコマンド | バシャログ。