With time website designs have become increasing beautiful, fancy and easy to use – thanks to the advancement of web designing industry. There was a time when a website was just a collection of boring web pages linked together, which was totally not appealing. The growth of designing and development industry is such that new techniques and trends pop up every now and then, which aim at making the
Gaming Laptop 4 Best Mini-LED Laptops in 2023 Regardless of whether you’re gaming or just need an excellent display, our recommendation for the best Mini-LED laptops in 2023 that you can buy should help. Read More 2-in-1 Laptops 4 Best 2-In-1 Gaming Laptops 2-in-1 gaming laptops do exist. Certain 2-in-1 laptops have beefy specs that make them viable for modern gaming. Read More Buying Guides 5 Bes
Unslider ? the super-tiny jQuery slider レスポンシブでタッチ対応な軽量なスライダー実装jQueryプラグイン「Unslider」 クロスブラウザ・キーボードショートカット・タッチ等にも対応しており、最近の環境にマッチした使い方ができます。 コールバック、スピード調整等のオプションも指定可能。 シンプルなスライダーを実装する際にレスポンシブでタッチ対応というのはなかなかありがたいところですね 関連エントリ パララックスなスライダーを実装できるjQueryプラグイン「FractionSlider」 ギャラリー、スライダー等、複数画像の見せ方を色々提供するjQueryプラグイン「Rondell」 様々なタイプのスライダーが作れるjQueryスライダープラグイン「Jquery Slider Shock」 タッチ可能でレスポンシブなスライダー実装「RoyalS
なんだか話題になってるみたいですね?『Camera』というスライドショー。 特徴としては レスポンシブ 多機能、ハイクオリティ 多彩なエフェクト スキンも多数用意 WordPressで管理できる という感じなのですが、WordPressプラグインは本当にびっくりしました。 ウィンドウリサイズするとちゃんとレスポンシブ WordPressプラグイン。管理画面もしっかり用意されている 管理画面上でエフェクト等が細かく設定可能 他にも多数機能あり フリーなんですが、サポート(寄付)してね、というスタンスなのでもしよければ寄付して使ってみてはいかがでしょうか Camera http://www.pixedelic.com/plugins/camera/ WordPressはこちらから http://wordpress.org/extend/plugins/camera-sli
こんにちは、サリーです。 最近は無料のスライダーでも良質のものがたくさん溢れていて、どれを使っていいか悩みすぎてしまう。。ということがよくありまして。 「これだ!」という決め手があればなあ。ということで、今回は他との違いを見せつける個性的なスライダーばかりを集めてみました。 今すぐ使いたくなるような、わくわくする動きでいっぱいです。デモページと共に紹介していきます。 【最新スライダーはこちら!】 ☞ 高機能なJavaScriptの人気スライダープラグイン4つを実際に使ってレビューしてみた Slit Slider Revised http://tympanus.net/codrops/2012/10/24/slit-slider-revised/ DEMO: http://tympanus.net/Tutorials/FullscreenSlitSlider/ 絵が真ん中から横にバカッと、時
A bene placito You have just dined, and however scrupulously the slaughterhouse is concealed in the graceful distance of miles, there is complicity. Ralph Waldo Emerson Regula aurea Until he extends the circle of his compassion to all living things, man will not himself find peace. Albert Schweitzer Dum spiro, spero Thousands of people who say they 'love' animals sit down once or twice a day to en
CoverScroll jQuery plugin カッコいいカバーフローを実現できるjQueryプラグイン「CoverScroll」。 次のような画像をアイコン風にして綺麗にアニメーションさせられるカバーフローを簡単に実装できます 必要なライブラリを読んで上記のようにマークアップを記述して $('#container').coverscroll(); と書くだけ。 オリジナル画像は次のようにサイズは自由で、ライブラリが勝手にリサイズ&角丸補正してくれます。 色々と使えそうですね 関連エントリ 複数要素をランダムにフェードインさせられるjQueryプラグイン「champagne.js」 フォームをカッコよくするjQueryプラグイン集15 見た目がクールなグラフ描画用jQueryプラグイン「Morris.js」 レスポンシブなカルーセル実装jQueryプラグイン「Slastislide」
テーマ左上から、base、sunny、le-frog、ui-darkness 対応ブラウザは、下記の通りです。 iPadも対応というのはいいですね。 Chrome/Chromium Safari Firefox IE Opera iPad impress.jsからの移行 jmpress.jsは「impress.js」のjQuery版で、impress.jsの特徴全てと更に多くの機能を備えています。 impress.jsから移行するには、jquery.jsを加え、スクリプトをimpress.jsからjmress.jsにし、スクリプトの呼び出しを「$(selector).jmpress(); 」に変更します。 impressのデモをjmpress.jsで動かしたデモ jmpress.jsの使い方 HTML ルートとなるdiv要素に「id="jmpress"」をつけ、各コンテンツをdiv要素で配
jQuery Touch Swipe Slider イメージ 現在KARA-FULLのトップで使っているスライダーはjQueryベースで拡張性の高いSliderKitというのを使っているんですが、スマートフォン対応を考えるとちょっと使いにくさを感じたのでスワイプ(フリック)などの動作に対応したTouchSwipeというタッチデバイスをベースにイメージスライダーを作成しました。 俗にいうjQueryプラグインってやつです。 このTouchSwipeの便利なところはタップやスワイプだけでなく2本指でのスワイプにも対応しているという点です(使ってませんが)。ただあくまでこのプラグインはタッチデバイス用のプラグインなのでスライダーなどの機能は自分で作る必要があります。 という訳で作ったのがコチラ。 Demo:jQuery Touch Swipe Slider – jQuery animation
前回の記事で、iPhoneやiPad、Androidなどに加えてPCでも動作する フリック/スワイプ動作UIをjQueryで実装する方法を紹介しましたが、 前回の単純なフリック/スワイプのUI動作に加えて、 自動で次の画像に切り替わるスライドショー動作と メインビジュアル部分にNEXT/BACKのボタンを追加したパターンでの 画像ギャラリーを作ってみたので紹介してみたいと思います。 jQueryでフリック/スワイプ動作付きの自動再生スライドショーを作成する実験 まずは動作サンプルから。 別枠で表示する場合はこちらから 一定の間隔で自動で次の画像に切り替わります。 画像の切り替えはサムネイルクリックの他、メインビジュアル部分の左右にあるNEXT/BACKボタンと メインビジュアル部分をフリック/スワイプすることで切り替えることが可能になっています。 メインビジュアル部分にマウスオーバーしてい
jQueryとCSS3アニメーションを使った、パララックス対応のコンテンツスライダーを実装するチュートリアルを紹介します。 Parallax Content Slider with CSS3 and jQuery [ad#ad-2] デモ 実装 デモ 一枚のスライドには、h2要素、パラグラフ、リンク、画像が配置されており、それぞれが異なるタイミングでスライドします。 分かりにくいかもしれませんが、背景もアニメーションで動いています。 Kendo UI こちらも当然パララックス対応のコンテンツスライダーです。 こっちの方が背景がはっきりしてるので、その動作を楽しめると思います。 実装 実装は各ポイントとなる箇所を説明します。 HTML スライダーは複数のスライドを含んでおり、それぞれのスライドにh2要素、パラグラフ、リンク、画像を含んでいます。 <div id="da-slider" cla
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 Web制作者というか、フロントエンド中心です。 WebデザインとかHTML5とかJavaScriptなどの スライドと、PHPなどが少し。タイトルで誤解 したらすみません。そろそろ年末年始の勉強 用に情報をまとめておきたいと思います。勉強 になるブログ記事!みたいなのはほっといても 誰かがまとめるんじゃないかな。 というわけで完全に自分用なのでいつも通り内容は偏ってます。一気にまとめて復習・・・出来るといいなwちゃんとアウトプットしないとダメですね・・とはいえ適当に端折ってます。そんな見る暇無さそうですし。 結構まとまりないです。 色彩センスのいらない配色講座
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 実用性は別にして、こういうの嫌いじゃない ので記事にします。よくあるイメージギャラリー なんですが、画像が変わる際のエフェクトが 無駄に凝っています(褒め言葉です)。こんな 事もflashを使わないで出来るんだなー、と 素直に関心したので、同じ気持ちで見て 頂けたら嬉しいです。 エフェクトはかなり多く用意されており、どれもなかなか派手な印象です。これだけのエフェクトをクロスブラウザに対応させているのもちょっと驚きです。※IE6にも対応とあるのですが、現在諸事情で確認出来ませんので対応してなかったらごめんなさい。 えらいこっちゃ・・なエフェクトばかりです。エフェクトはかなりの数が用意されており、1つのエフェクトも細かい設定が可能になっています。 まずはエフェクトの一部
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く