Sticky Position (Bar) with CSS or jQuery
The idea of ‘sticky position’ is to make elements on a website stick and remain visible. These elements will initially be in their designated position, and when scrolling down the webpage, they will follow the scroll. Facebook applies this technique to its sidebar; when you scroll down the page, the sidebar follows the scroll, remaining visible. Historically, this effect was achieved using JavaScr
jQueryとCSS3を使ったアコーディオンメニューを詳しく説明します｜Webpark
jQueryとCSS3を使ったアコーディオンメニューを作ってみましたので、作り方を紹介します。かなり長くなりますが、お役に立てばうれしいです。 色々事情があってIEでご覧になっている方のためにスクリーンショットも載せておきます。カテゴリー３にマウスを乗せているところです。 それではコードを解説していきます。 HTML まずはHTMLです。無駄に長いですが一応載せます。 <ul id="accordion"> <li><a href="#">カテゴリー１<span class="arrow rotate"></span></a> <ul id="active"> <li><a href="#">サブカテゴリー１</a></li> <li><a href="#">サブカテゴリー２</a></li> <li><a href="#">サブカテゴリー３</a></li> </ul> </li> <l
スマホ対応初心者に送るjQuery Mobileの使い方“超”入門
スマホ対応初心者に送るjQuery Mobileの使い方“超”入門：jQuery Mobileでスマホ向け企業サイト構築（1）（1/2 ページ） jQuery Mobileを利用した企業サイトの構築【準備編】 iPhone、Androidなどのスマートフォンが普及するなかで、スマートフォンブラウザ向けWebサイトの需要は拡大しています。グーグルの調査によると、日本のスマートフォン普及率は2011年1、2月の時点で「6％」、2011年9、10月では「17％」です。平成24年の国内スマートフォン販売シェアが半数を超え、さらなるシェアの拡大は確実です（参考）。 PCの販売台数が低下する中、iPadなどのタブレット端末の普及も伴い、今後モバイル端末への対応が必須となってきます。かつてPC上のWebブラウザで起こったシェア争奪戦「ブラウザ戦争」と同様に、モバイル端末のシェアの奪い合いも激しくなってい
jQueryの基礎知識(2/3):初心者のためのjQueryプログラミング入門 - libro
では、jQueryのライブラリはどのように利用すればよいのでしょうか。――JavaScriptのライブラリは、どんなものであれ、基本的な使い方は共通です。すなわち、「ライブラリファイルをダウンロードし、使用したいWebサイトにアップロードし、<script>タグでそれをロードする」というものです。 ライブラリというとなんだか特殊な感じがしますが、要は「ただのスクリプトファイル」なのです。特にjQueryは、本体がたった１つのスクリプトファイルでしかありません。 http://jquery.com/ まずは、上のアドレスにアクセスをしましょう。ここが、jQueryのサイトです。そして、ページの右側にある「Download(jQuery)」というボタンをクリックしてください。ぶわ～～！！っと画面にJavaScriptのスクリプトが表示されます。これが、jQueryのライブラリです。後は、それを
jQuery入門 with Dreamweaver CS5.5 前編 | ADC - Adobe Developer Connection
jQueryは、非常に人気と歴史のあるJavaScriptライブラリです。jQueryを利用すれば、直感的なコードで、思い通りのUI処理を容易に実現できます。この記事では2回にわたり、jQueryの基本を説明するとともに、実際にサンプルを作成しながらjQueryプログラミングの要諦を紹介します。 jQueryを利用する際の開発環境ですが、jQueryではコードを非常にコンパクトにできるため、普通のテキストエディタでもプログラミングを行うのはそれほど難しいことではありません。しかし、Dreamweaver CS5.5にはjQuery開発を支援する様々な機能が用意されており、Dreamweaver CS5.5を使えば、開発に必要な時間をさらに短縮することができます。 jQueryは、手軽に「DOM（Document Object Model）」を操作できるようにするライブラリです。DOMという
Pelfusion - All about technology
The moments after your phone gets wet are crucial. Follow these steps to improve your chances of saving your device. … Read more
Fireworks＋Dreamweaver：簡単！ jQuery Mobileのテーマ＆サイトの作成 | ADC - Adobe Developer Connection
Fireworks CS6には、jQuery Mobileのテーマを作成する機能が追加されました。CS5／CS5.1向けに同様の機能を提供する拡張機能「Fireworks CSS3 Mobile Pack」がAdobe Labsにて提供されていますが、CS6では日本語化されているなどの違いがあります。 アイコンの変更 早速、jQuery Mobileのテーマを作成してみましょう。メニューから［コマンド］→［jQuery Mobileテーマ］→［新規テーマを作成］を選択すると、jQuery Mobileテーマ作成用の画面が表示されます。jQuery Mobileのデフォルトテーマには5つのスウォッチ（カラーバリエーションなもの）が用意されており、Fireworksでも初期状態では5つのスウォッチがページとして定義されています。さらに、スウォッチで共通に利用するアイコンなどを設定するページ、テ
CSS で作るスマートフォン向け片手操作メニュー
ちょっとしたお遊びなんですが、普段は画面の下の隅に隠れてて、クリック （タップ） で展開、いくつかのショートカットメニューが表示される、しかもスマートフォンだと片手だけで操作しやすいみたいな UI を CSS と超簡単な JavaScript （jQuery 使用） で作ってみたので紹介。 久々にこの手のネタ書いた気がしますけども… ちょっとしたお遊びなんですが、普段は画面の下の隅に隠れてて、クリック （タップ） で展開、いくつかのショートカットメニューが表示される、しかもスマートフォンだと片手だけで操作しやすいみたいな UI を CSS と超簡単な JavaScript （jQuery 使用） で作ってみたので紹介。多分言葉で言っても伝わりにくいと思いますので実際のサンプルをまずは見てみてください。 CSS で作るスマートフォン向け片手操作メニュー サンプル 現在最新版の Firefox
アドビ―Dreamweaverデベロッパーセンター
Enhance and extend DreamweaverDreamweaver provides its own API as well as the Common Extensibility Platform (CEP), and offers you the flexibility of using C++, HTML, CSS, and JS to build extensions for Dreamweaver. You can extend the Dreamweaver UI, add powerful features for building web apps and automate entire cross-application workflows. Build custom web development toolsImport database data in
Dreamweaver CS5.5 マスターシリーズ 第2回 jQuery Mobile Widgetでスマートフォン対応サイトを作ろう その1 | デベロッパーセンター
Dreamweaver CS5.5 マスターシリーズ 第2回 jQuery Mobile Widgetでスマートフォン対応サイトを作ろう その1 このマスターシリーズでは、Dreamweaver CS5.5の新機能の中からモバイル開発機能を中心に解説します。 DreamweaverはCS5.5になり、今までよりも楽にスマートフォン対応サイトを制作できるツールとして進化しています。CS5.5で新たに導入されたのが「jQuery Mobile Widget」という機能です。このjQuery Mobile Widgetを利用することで、jQuery Mobileの知識が無くとも、直感的にスマートフォン対応サイトを作成することができます。本記事では、サンプルサイトを作成しながら、jQuery Mobile Widgetの使い方を解説します。 ※jQuery Mobile 1.0beta1を含む以前
少しのコードで実装可能な20のjQuery小技集
少しのコードで実装可能な20のjQuery小技集素敵な動きを手軽に実装できるJavaScriptライブラリ「jQuery」。jQueryには多くのプラグインが揃っていますが、今回はプラグインなしで実装できるjQueryの小技を紹介します！「jQueryってなんだ？」という人もコピペで実装できますよ！サンプルも用意したのでぜひご覧ください！ 追記：この記事で紹介されているいくつかの方法が、今では CSS のみで実装可能です！詳しくは「かつては JavaScript を利用していたものの、今では CSS のみで実装できる 10 の小技」をご覧ください。 jQuery の基本的な使い方まずはjQuery 本家から jQuery ファイルをダウンロードします。<head> 内に下記を記述し、jQuery ファイルを読み込みます。 <script type="text/javascript" src
95+ Stunning Jquery Effects, Lightbox, Tutorials | Web Designers Inspiration and Online Resource | Web Designers Blog
JQuery is one of the most popular JavaScript frameworks which are powerful tools and huge benefit for developers to improves the designs integration with Web applications. This article will briefly introduce you to the jQuery with excellent examples. JQuery is really wonderful plug-in for designers which are giving attractive functionality to the web sites. Even now day’s every designers focusing
スマフォのHTML5環境向けに作られたjQueryライクな軽量フレームワーク・jQ.Mobiの日本語サンプル作った - かちびと.net
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 なかなか良さそうだったので備忘録。iOSやAndroidなど、スマートフォンでのHTML5環境に合わせて作られた軽量モバイルフレームワークです。jQuery互換なので慣れてる方は使い方もすぐに覚えられると思います。特に軽量なのが嬉しいですね。 現状、jQueryを使うのであればスマートフォンにはjQuery Mobileという選択肢となりますが、やはりファイルサイズが気になります。そこで、jQueryをなんとか軽量に使おう、という動きが少し目立ってきました。 例えばzepto.js。がそうですし、jquipという、目的に合わせてjQueryを細分、モジュール化するライブラリなどもあります。 jQ.Mobiもその一つで、jQueryっぽく使えるHTML5環境のスマート
Helpful jQuery Tutorials to Create Beautiful Tooltips
Tooltips can really helped your site to increase usability and user experience. Together with a user mouse hover (or clicking) action, then a small box appears with extra information, tips and help when using a site. To give your tooltips more interesting and interactive the best ways is to use javascripts, especially jQuery. Here are, we’ve collected 15 helpful jQuery tooltips tutorials than can
[JS]これFlashじゃないの？ってなるナビゲーションを実装するjQueryのチュートリアル
軽快なアニメーションが心地よいナビゲーションを実装するjQueryのチュートリアルを紹介します。 タイトルにある通り、Flashは使わないで実装されてます。 Animated Content Menu with jQuery デモページ [ad#ad-2] まずは、デモページを堪能ください。 ナビゲーションの各ラベルをクリックすると、それに対応したパネルがアニメーションを伴って開くようになっています。 デモページ 実装 HTMLの構造は、背景画像、グリッドのオーバーレイ、ローディングのアイコン、メインメニューの4つから構成されています。 HTML：背景 背景は、背景画像とオーバーレイとローディングをdiv要素で内包します。 <div id="ac_background" class="ac_background"> <img class="ac_bgimage" src="images/D
40分で覚える！jQuery速習講座 (1/6)
いまやWeb制作に欠かせなくなったJavaScript。でも、「JavaScriptはほとんど“アリモノ”で済ませている」という方も多いのでは？ そこで、WebデザイナーやマークアップエンジニアなどのWeb制作者の方向けに、いま一番人気のJavaScriptライブラリー「jQuery」の基本を学べる特別レッスンをお届けします。題して、「40分で覚えるjQuery」。要点だけにぎゅっと絞って解説しますので、手を動かしながら今すぐjQueryを始めましょう。 【0分目：導入編】 jQueryのダウンロードと利用方法 jQueryのライブラリー本体（JavaScriptファイル）は公式サイトからダウンロードし、head要素などにscript要素を書いて読み込みます。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
16 Useful jQuery Tutorials to Enhance your WordPress Site
HugeDomains.com
Home - Web Design Agency #1 Best Affordable Web & App Development UK, USA, Canada