Webやアプリのデザイントレンドを紹介。たまに雑談。

Browse By

Tag Archives: Javascript

[WordPress] Free Slideshow Plugins For WordPress – ワードプレスで使えるフリーのスライドショープラグイン

  • Pocket
  • このエントリーをはてなブックマークに追加

WordPressで使える、フリーのスライドショープラグインばかりを集めた記事。スライドショーである点に重きを置いているため、その手段については様々です。中には最近じゃあまり見る機会のなくなったFlashを使ったスライドショーもあります。写真を複数枚見せるのに最適なスライドショーやサムネール表示、またトップページでのトピック表現を行うのに適したスライダーなど、ソレ系のプラグインを探す際に役立ちそうな記事。

[Javascript] jQuery Menus with Stunning Animations – jQueryを使ったクールなメニュー表現

  • Pocket
  • このエントリーをはてなブックマークに追加

jQueryを使ったクールなメニューの作例がまとめられた記事。この記事イイっす。かっけーメニューが色々紹介されてます。こうした動くメニューを見てて思いました。7,8年前はこういうのFlashで作ってたよなぁ・・・とか。なんか懐かしいです。まぁ今でも表現手法についてはそれほど差はありませんが、それを実現するプロセスはすっかりJSで上書きされましたね。ちょっと変わったナビゲーションの見せ方を模索してる時なんかにナイスなまとめ記事。

[Javascript CSS3] 20 JQUERY AND CSS3 TUTORIALS – jQueryやCSS3を使ったチュートリアル

  • Pocket
  • このエントリーをはてなブックマークに追加

jQueryやCSS3を使った、動きのある表現をまとめた記事。アイキャッチとなる結果を集めているので、その手法に関してはJSだったりCSS3だったり色々です。最近こういうまとめ方をする記事をちょくちょく見るようになりましたが、手段にはこだわらないという意味でなかなかナイスだと思います。

[Javascript] 65 jQuery Tutorials To Help You Customize Your Site – jQueryを使ったサイトカスタマイズ

  • Pocket
  • このエントリーをはてなブックマークに追加

jQueryを使ってサイトをカスタマイズするのに使えるプラグイン。65ものプラグインが紹介されてます。メニュー、ズーム、スライドショー、Lightboxのようなmodal表示、ドロップダウンメニュー、フェード表現、フォーム装飾、角丸、ポップアップなど、様々な種類のプラグインが紹介されてます。動きを付けた表現やパーツ装飾の効率化をしたい場合に是非。

[Javascript] Making an Apple-style Splash Screen – Appleのトップページのようなスプラッシュスクリーン制作のチュートリアル

  • Pocket
  • このエントリーをはてなブックマークに追加

最近になってAppleがトップページで実行するようになった、新製品を紹介するスプラッシュ画面(今はやってないみたいです)をJSを使って再現するというチュートリアル記事。最初に製品だけが表示されて、その後他のコンテンツがフェードインしてくるっていうアレです。言葉で説明しても分かりづらいですね。デモページを見ればだいたいどんなものか分かると思います。JSライブラリにはjQueryが使われているようです。サイトロード時に別のページを用意する事なく、自然な感じで大きく紹介したい場合に便利な表現。

[Javascript CSS3] 21 of Best jQuery And CSS3 Tutorials – jQueryやCSS3に関するチュートリアルまとめ

  • Pocket
  • このエントリーをはてなブックマークに追加

jQueryやCSS3を使ったクールな表現と、そのチュートリアルをまとめた記事。jQueryとCSS3をひとまとめにしちゃう記事ってのも珍しいですが、表現として近い部分も実際ありますよね。例えばマウスオーバー時のボタンの動き、スライドショーの制作、ドロップダウンメニューやアコーディオンメニューなど、手段としてどちらを選ぶかという違いこそあれ、結果は似たようなものだったりします。サイトに動きを持たせる事に主眼を置いた記事で、その手の表現をしたい場合にナイスです。

[Web Design] Bringing Interactivity To Your Website With Web Standards – あなたのサイトをインタラクティブにするテクニック

  • Pocket
  • このエントリーをはてなブックマークに追加

Webのスタンダードな技術を使って、サイトをインタラクティブにするためのテクニックの紹介。やや抽象的な表現ですが、ようするにウェブデザインにおけるモダンな手法についての記事です。スライドショー、CSS3を使ったトランジション、SVGを使ったアニメーション、Canvasを使ったアニメーションの4つの内容が紹介されてます。主に動きに力点を置いた記事内容で、それぞれの実装方法や作例も紹介されてます。今まではこうした動きを使った見せ方はFlashが専門に担当してましたが、今後はよりWebスタンダードな手法が主流になっていくんでしょうね。なかなか興味深い内容でした。

[Javascript] 10 Useful jQuery Plugins for Images – イメージに関する使えるjQueryプラグイン

  • Pocket
  • このエントリーをはてなブックマークに追加

イメージに関する使えるjQueryプラグイン10選。イメージスライド、顔認識、フルスクリーン表示、LightboxっぽいModal表示、トランジション付きの画像抽出などが紹介されてます。とは言っても約半分は画像スライダーです。画像の見せ方、フォトギャラリーとしての一選択肢という感じで参考になりそうな記事。


Warning: Trying to access array offset on false in /home/users/0/mantid2/web/mantiddesign/wp-content/themes/mStyle8/footer.php on line 8