タグ

jQueryに関するcotacottoのブックマーク (30)

  • 『jQuery 最高の教科書』サンプルサイト

    Chapter 02 3 ステップではじめるかんたん jQuery 入門 # Easing Chapter 04 確かな基礎力を養う jQuery の基テクニック 01 さまざまなホバーエフェクトで学ぶ動きのある表現の基 02 画像とキャプションの表現 03 丸いボタンのレイアウト 04 見え隠れするサイドバー 05 タイポグラフィの表現 # Chaper 04 完成版 Chapter 05 活用の幅を広げる jQuery の必修テクニック 01 なめらかな動きの スライドショー Basic 02 多機能なスライドショー Advanced 03 スティッキーヘッダー Basic 04 デザインが変化する スティッキーヘッダー Advanced 05 画面領域を有効活用できるタブ Basic 06 高機能で拡張しやすいタブ Advanced 07 スムーズスクロール Basic 08 拡

    『jQuery 最高の教科書』サンプルサイト
  • 触りながら覚えるスマホ向け企業サイト設計の基礎知識

    触りながら覚えるスマホ向け企業サイト設計の基礎知識:jQuery Mobileでスマホ向け企業サイト構築(2)(1/3 ページ) まだjQuery Mobileを触ったことのないWeb制作者向けに、基的な利用方法を学びながら、jQuery Mobileを使った簡単な企業サイトの構築の仕方を解説していきます。第2回は、簡単なスマホ向け企業サイトを設計するための基事項を解説し、HTML5+jQuery Mobileでの構築の手順を紹介します HTML5+jQuery Mobileのサイト構築を触りながら作ろう 前回の連載第1回「スマホ対応初心者に送るjQuery Mobileの使い方“超”入門」はjQuery Mobileの概要や役立つ開発ツール、使い方、構造の基礎を紹介しました。 第2回はベーシックな企業サイトの構成を基にシンプルなサイト作成を紹介していきます。また、作成する中で登場する

    触りながら覚えるスマホ向け企業サイト設計の基礎知識
  • スマホ対応初心者に送るjQuery Mobileの使い方“超”入門

    スマホ対応初心者に送るjQuery Mobileの使い方“超”入門:jQuery Mobileでスマホ向け企業サイト構築(1)(1/2 ページ) jQuery Mobileを利用した企業サイトの構築【準備編】 iPhoneAndroidなどのスマートフォンが普及するなかで、スマートフォンブラウザ向けWebサイトの需要は拡大しています。グーグルの調査によると、日のスマートフォン普及率は2011年1、2月の時点で「6%」、2011年9、10月では「17%」です。平成24年の国内スマートフォン販売シェアが半数を超え、さらなるシェアの拡大は確実です(参考)。 PCの販売台数が低下する中、iPadなどのタブレット端末の普及も伴い、今後モバイル端末への対応が必須となってきます。かつてPC上のWebブラウザで起こったシェア争奪戦「ブラウザ戦争」と同様に、モバイル端末のシェアの奪い合いも激しくなってい

    スマホ対応初心者に送るjQuery Mobileの使い方“超”入門
  • jQuery Mobile APIでもっとJavaScriptプログラミング ―(1/2) - @IT

    連載:jQuery Mobile入門(最終回) 第6回 jQuery Mobile APIでもっとJavaScriptプログラミング 山田 祥寛 2012/06/14 連載の初回では、jQuery Mobileは(jQueryのモバイル版というよりも)jQuery UIのモバイル版である、と述べた。実際、jQuery Mobileでは標準であまたのウィジェットを提供しており、マークアップのみでネイティブ・アプリ・ライクなスマホ・アプリを開発できてしまう。もっとも、その特長が故に、ともすると、jQuery Mobileではあらかじめ用意された範囲でしかアプリを開発できないと思われがちだ。 そのようなことはない。jQuery Mobileでは、豊富な独自のJavaScript APIを提供しており、これらを呼び出すことで、固有の仕組みをアプリに簡単に組み込める。そうした自由度の高さも、jQu

  • [2]メソッドチェーンとイベント処理

    ポイント4 繰り返し処理は不要 jQueryオブジェクトでは繰り返し処理を意識する必要がありません。 $()関数は条件によっては複数の要素を返すことがあります。例えば、図2の例でも$()関数は複数の<img>要素を取り出しています。うれしいことに、jQueryオブジェクトはこれら要素のすべてに対して、「.」以降のメソッド部分の処理を実行してくれるのです。 一般的なJavaScriptであれば、要素のセットから一つずつ要素を取り出し、処理していく必要があります。JavaScriptを理解している人であれば、まずはfor命令の利用を思い浮かべるでしょう。しかしjQueryではこのような手間をかける必要がありません。この性質もまた、jQueryがシンプルにコードを書ける理由となっています。 ポイント5 メソッドは連結して呼び出せる 図3のリストに、ちょっとだけコードを追加してみましょう(リスト1

    [2]メソッドチェーンとイベント処理
  • Visual Studio 2010とjQuery、これからのクライアントサイド開発(1/2) - @IT

    連載:ASP.NET 4+“jQuery”でAjax開発 第2回 Visual Studio 2010とjQuery、これからのクライアントサイド開発 日マイクロソフト 物江 修 2011/06/24 前回は、Visual Studio 2010に正式な製品の一部としてjQueryが同梱されるに至った経緯と、ASP.NETとjQueryの関係について紹介するとともに、ASP.NET 4におけるAjax開発の全体像について解説した。 今回は、Visual Studio 2010におけるjQueryの実際の使用方法と、それに関連する機能、jQueryの機能を拡張する方法についても解説する。 ■Visual Studio 2010とjQuery Visual Studio 2010でのjQueryを使用した開発方法について解説する前に、jQueryについて(ご存じない方のために)簡単に紹介して

  • ASP.NET AJAXとjQueryの協力関係(1/2) - @IT

    連載:ASP.NET 4+“jQuery”でAjax開発 第1回 ASP.NET AJAXとjQueryの協力関係 日マイクロソフト 物江 修 2011/05/27 ■連載の概要と目的 Visual Studio 2010から、正式な製品の一部としてOSS(オープンソース・ソフトウェア)のJavaScriptライブラリである「jQuery」がASP.NETプロジェクト・テンプレートに含まれるようになった。これにより、現在のASP.NET 4には、ASP.NETアプリケーションでAjax機能を実現するための要素として、「jQuery」と、従来からある「ASP.NET AJAX」の2つの技術が存在している。 「Visual Studio 2010のベータ段階までAjaxの新しいJavaScriptライブラリを搭載することが計画されていたが、製品版のリリースの時点でjQueryが標準で搭載

  • jQueryと「linq.js」を連携させてDOMをLINQにより処理するには? - @IT

    「TIPS:JavaScriptで配列をLINQにより処理できるライブラリ「linq.js」を利用するには?」ではlinq.js単独での基的な使い方を紹介したが、今回はjQueryと連携した使い方を紹介する。 jQueryは優れたライブラリであるが、コレクション処理に関しては貧弱だ。linq.jsはコレクション処理に特化し、DOMなどへの依存もないため、jQueryと干渉することなく、欠けた部分を補完できる。 ●linq.js(jQueryプラグイン版)の使い方 linq.jsをダウンロードし、通常のjQueryプラグインと同じく、まずjQueryを参照し、その下にlinq.jsのjQueryプラグイン版であるjquery.linq.jsファイルへのパスを記述すればよい。例えば下記のようなコードを記述する。 <script src="Scripts/jquery-1.4.1.js" ty

  • エフェクトをプラスするjQueryプラグイン

    CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

    エフェクトをプラスするjQueryプラグイン
  • 「ノンプログラマーのためのjQuery入門」のスライドが凄く分かりやすいですね - かちびと.net

    Twitterに流れてきたスライドがとっても 分かりやすかったのでブログでより多く の方に拡散。ノンプログラマー向けの jQueryの基講座。これからjQuery を使おう、という方は読んでおくと良さ そうですね。 ノンプログラマー向けにjQueryの基礎をスライド化してくれています。 @pocotan001さん作のスライドです。 このスライドを見ながらコーディングする、というより、基礎知識を頭に入れるのに適したスライドだと思いますので気軽にご覧になってみて下さい。ハードルがかなり下がると思います。 また、当ブログでもjQueryプラグイン等の情報を取りあえげていますので合わせてどうぞ。 jQueryのリファレンスサイトと入門書籍 [2011.09.21アップデート] よくアクセスいただくのでハブ的な役割くらいは果たそうと思います。 jquery / jQueryの家です。 jQuer

    「ノンプログラマーのためのjQuery入門」のスライドが凄く分かりやすいですね - かちびと.net
  • ちょっとしたUI効果をプラスするjQueryプラグイン

    CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

    ちょっとしたUI効果をプラスするjQueryプラグイン
  • サイトの見せ方をひと工夫するjQueryプラグイン

    CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

  • jQuery事始め・コピペに頼らず、基礎知識を理解して実際に動かしてみる - かちびと.net

    人気のJavaScriptライブラリ、jQueryもかなり 情報が増えました。僕の様に知識が無くても 簡単に動きのあるWebサイトや、更なるユー ザビリティの向上を可能にしてくれましたが、 いつまでもコピペではいずれ困る事になります。 その前にそろそろ基礎から学んでみませんか。 という訳で、jQuery事始め。さほど知識が無い僕が書くのも微妙なんですが、一緒に学んでいきましょう、という事でご了承下さい。内容は基礎中の基礎です。 いつまでもコピペに頼っていては、何か問題が起こったときに対応できませんし、そもそもコピペするならjQueryである必要はありません。 でもjQueryはすごく便利なので、ちゃんと使いこなしたいところですよね。この記事が、誰かが勉強し始める切欠になれば幸いです。 jQueryを使うには まず、jQueryを利用するには体を読み込む必要があります。方法は2つあって、

  • 画像を効果的に見せるjQueryプラグイン

    はじめに 第4回「手軽に扱えるjQueryプラグインを使ってみよう」では、jQueryのユーザーインタフェースを拡張するjQueryプラグインの中から、メニューバー、タブ、画像のスライダー、ズーム機能、Twitterのタイムライン表示を紹介しました。第5回では、画像の切り替えや見せ方をテーマに以下のようなプラグインを解説していきます。 画像のスライドショー(Simple Fade SlideShowプラグイン) 画像の円形スライド(MobilyBlocksプラグイン) 画像上にポップアップを表示する(MobilyMapプラグイン) パノラマ画像の表示(panorerプラグイン) 対象読者 jQueryプラグインに興味があり、使ってみたい方 必要な環境と準備 jQueryのダウンロード 執筆時点のjQueryの最新版は、1.4.4です。第1回を参考に、ダウンロードしてください。また、jQue

  • 少しのコードで実装可能な20のjQuery小技集

    2016年6月22日 jQuery 素敵な動きを手軽に実装できるJavaScriptライブラリ「jQuery」。jQueryには多くのプラグインが揃っていますが、以前書いた「少しのコードで実装可能な20のCSS小技集 」に続き、今回はプラグインなしで実装できるjQueryの小技を紹介します!「jQueryってなんだ?」という人もコピペで実装できますよ!サンプルも用意したのでぜひご覧ください! ↑私が10年以上利用している会計ソフト! 追記:この記事で紹介されているいくつかの方法が、今ではCSSのみで実装可能です!詳しくは「かつてはJavaScriptを利用していたものの、今ではCSSのみで実装できる10の小技」をご覧ください。 jQueryの基的な使い方 まずはjQuery家からjQueryファイルをダウンロードします。<head> 内に下記を記述し、jQueryファイルを読み込みます

    少しのコードで実装可能な20のjQuery小技集
  • 手軽に扱えるjQueryプラグインを使ってみよう

    CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

    手軽に扱えるjQueryプラグインを使ってみよう
  • フォーム入力に役立つjQueryプラグイン

    連載では、JavaScriptライブラリの中でも人気が高まりつつあるjQuery UIとプラグインを取り上げます。今回は、Input Hint Overlay、Text input field filter、jQuery Validation、Password Strength、Simplest Twitter-like dynamic character countについて説明します。 はじめに 第2回「jQuery UIのウィジェットを使ってみよう」では、jQueryのユーザーインターフェースを拡張するjQuery UIのインストールから、jQuery UIのDialog、Datepicker、AutoComplete、ProgressBarの使い方を取り上げました。第3回では、第1回「jQuery UIのインタラクションを使ってみよう」でも簡単に触れたjQuery Pluginのフ

    フォーム入力に役立つjQueryプラグイン
  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    IDEA * IDEA
  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    IDEA * IDEA
  • IBM Developer

    IBM Developer is your one-stop location for getting hands-on training and learning in-demand skills on relevant technologies such as generative AI, data science, AI, and open source.

    IBM Developer