タグ

jQueryに関するjun_okunoのブックマーク (380)

  • 2011年に配信したjQueryやWordPressなどのWeb制作向け情報・総まとめ

    早いもので今年も残すところあとわずか となりました。今年は年をまたいで仕事 しないとならないので早めに総まとめ的 な記事を書いておきます。と言っても 完全に自分用のまとめですのでご覧に なっても役に立たないと思いますがw というわけで、後で復習するのに、探さなくていいようにしただけの自分用リンク集です。 jQueryとWordPressにやたら偏ってます。過去記事のまとめですので目新しいものは一切ありません。 ネタは省いてます。あと、種類で細かく分ける気力が残ってないので順不同です。 スマフォ向けが多いのでスマフォ関連は※印を振っておきました。復習用なのでリンクは全て当サイトの記事にしてます。他の方には二度手間ですがご了承下さいマウスを乗せるとキャプチャが表示されます。130個くらいです。普段から小ネタばっかりなのでそんな感じのまとめです。 【追記】(僕が)リンク見にくいので色を変えました

    2011年に配信したjQueryやWordPressなどのWeb制作向け情報・総まとめ
  • [JS]jQueryのプラグイン100選 -2011年総集編

    2011年に紹介したものを中心としたjQueryのプラグイン100+α選です。 今年はCSS3の影響もあってかアニメーションのエフェクトが目立ちました。また、Resposive Web Design用の可変ものや動画・テキストを扱ったものも多かったですね。 [ad#ad-2] 動画関連 画像ギャラリー関連 画像拡大関連 画像配置・キャプション関連 背景画像関連 コンテンツスライダー・カルーセル関連 タブ関連 ナビゲーション関連 レイアウト関連 パネル・ボックス関連 ツールチップ・ティッカー関連 アニメーション関連 エフェクト関連 スクロール操作・スクロールコンテンツ関連 リスト関連 テーブル関連 フォーム関連 テキスト関連 見出し抽出関連 ローディング関連 エレメント・コンテンツ生成 その他 動画関連

  • jQueryのCSSセレクタAPIを高速に扱う方法 - KAYAC engineers' blog

    最近Androidとの抗争が激化しているago(@kyo_ago)です。 jQueryはCSSセレクタを多用する特徴がありますが、jQuery内では実行ブラウザやCSSセレクタの記述によって呼び出されるブラウザAPIが変わり、それによって実行速度にも影響が出ます。 この記事では「セレクタAPIとはなにか」、「CSSセレクタの記述によって呼び出されるセレクタAPIの種類」、「高速なセレクタAPIを使用するための方法」、「高速なセレクタAPIが使われるかどうか確認する方法」などを紹介したいと思います。 (※この記事はJavaScript Advent Calendar 2011 (フレームワークコース) : ATNDの1日目の記事です) セレクタAPIとはなにか セレクタAPIとは「#hoge .huga」のようなCSSセレクタから、DOM上に存在する要素を取得するためのAPIです。 jQue

    jQueryのCSSセレクタAPIを高速に扱う方法 - KAYAC engineers' blog
  • jQuery初心者向けの基礎をしっかり学べるサイト

    【jQueryって何からjQueryの基まで】... / 【jQueryの使い方から動作デモまで】jQue... / 【jQueryでのアニメーションからイージングま...他...全6件

    jQuery初心者向けの基礎をしっかり学べるサイト
  • Simple and fast .NET Web Services framework

    Simply Refreshing 1 framework for all your services and web apps that's intuitive and Easy-to-use! Never read another text-book to learn another heavy .NET framework again! Super Fast Obscenely fast! Built with only fast, clean, code-first and light-weight parts. Start using .NET's fastest serializers, ORMs, redis and caching libraries! Thoughtfully architected Holistically constructed with remote

  • 知識0からのjQuery Mobileを使ったサイト制作に役立ったサイト

    このブログのスマートフォンページをjQuery Mobileを使用して制作してみました。 それ以前はjQuery Mobileについてほぼ知識0の状態だった私が、今回の制作にあたり役に立ったサイトをまとめました。 このブログのスマートフォンページをjQuery Mobileを使用して制作してみました。 それ以前はjQuery Mobileについてほぼ知識0の状態だった私が、 今回の制作にあたり役に立ったサイトをまとめました。 jQuery Mobile | jQuery Mobile 元。 敢えて紹介するまでもないのですが一応。 現在のバージョンは1.0RC2(2011.11.01現在)です。そろそろ正式版がでる予定です。 jQuery Mobile 1.0b1 日語リファレンス jQuery Mobile 1.0b1 日語リファレンス バージョン1までの内容ですがjQuery

    知識0からのjQuery Mobileを使ったサイト制作に役立ったサイト
  • 汎用性の高い、jQueryの定番系プラグインのまとめ

    単体で使ってもいいし、それを使って更に面白いものを作りだすのにも役立つjQueryの定番系プラグインを紹介します。 いつもリリースされたばかりのプラグインを紹介しているので、たまには定番系で汎用的なものを。

  • 覚えておくと地味に便利だと思える日が来るかもしれないjQueryのコードスニペット何個か

    これならjQueryじゃなくてもいいんじゃ 無いか、っていう記事です。短くて使い やすいスニペットなんですが、まぁ用途 は人それぞれだと思うので適当に流して 下さい。自分が使いやすいようにまとめ たいだけです。 そのコードおかしいわーみたいなのあったらすいません。まぁその程度の記事です。というわけでいろいろとツッコミどころ満載かもですが、あんまり気にしないで下さい。じゃあ記事書くなよって話ですけどw デモの見方 jsfiddleというサービスを好んでよく使うのですが、あまり見慣れないかもなので一応デモの見方を。上図の○で囲った部分、Resultを押せばデモ画面に、再生ボタンでリロードします。 簡単なコードなので実践で使うにはもう少し工夫が必要です。また、jQueryの勉強にもなるかもしれません。jsfiddleはフォークできるので宜しければ改善や動作の勉強等にご利用下さい。 こういうスニペ

    覚えておくと地味に便利だと思える日が来るかもしれないjQueryのコードスニペット何個か
  • meca.js

    meca.jsとは meca.jsはマークアップエンジニアのコーディングを補助するためのjavascriptです。画像のロールオーバーやIE6の透過png対応などを実装しており、それぞれの機能を簡単にon/offできるので、使わない機能は無効にしてたりできます。その他にも、ターゲットになる要素のセレクタを設定でたりするのである程度柔軟に対応できます。(→元エントリー) 使い方 jQueryとmeca.jsを読み込みます。meca.jsの一番上の方に設定を書いてあるところがありますので、そこを自分の好きな設定に書き換えて下さい。 <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="meca.js"></script> ページ毎に設定を変更する meca.js

  • 定番機能をまとめて提供してくれるjQueryプラグインまとめ | バシャログ。

    ゲームボーイアドバンスの名作「カルチョビット」が3DSで出ると聞いてテンションあがってきたminamiです。 jQuery便利ですよね。さらにその便利なjQueryを使ってコーディング時の定番機能を提供してくれているライブラリがたくさんあるので集めてみました。 Laquu.js http://laquu.com/ 注目の最新プラグインです。「HTMLコーディング作業量を極力減らすためのjQueryプラグイン」ということで、 基的な機能もさることながら、ピックメニュー、タブ、ツールチップ、ティッカーといった、よく使うけど意外と手間のかかるUIが一つのプラグインでまかなえてしまうのがポイント高いです。個人的にはコナミコマンドが実装されてるのが熱いです! 対応するjQueryのバージョンは1.5以上です。 simplelib.js http://lab.starryworks.jp/js/si

    定番機能をまとめて提供してくれるjQueryプラグインまとめ | バシャログ。
  • 最近よくみる定番の動きは、だいたいこれで対応できるjqueryライブラリ | バニデザノート

    ウェブデザインのなかで、 jqueryをつかった、さりげない「動き」をウェブサイト上で導入するのが 定番になりつつありますね。 ふわっと、ポップアップみたいに浮き上がってくるウインドウ、 画像やテキストのスライドなど 最近良く見るjqueryでつくる「動き」で、おすすめのライブラリをまとめてみます。 要素をスライドさせるならJquery.cycle.plugin 画像や、テキストなど、 非常にシンプルなhtmlソースを認識して対応してくれるプラグイン。 上から落ちてきたり、横にスライドしたり、フェードイン・フェードアウトしたり スライド番号をつけたり、スライド領域の要素の右左に矢印をつけたりもできます。 シンプルなdemo Even More Demosもオススメです。 オプション一覧はこちら → jquery.cycle.plugin ページ内ポップアップ、lightbox風表現ならfa

    最近よくみる定番の動きは、だいたいこれで対応できるjqueryライブラリ | バニデザノート
  • 独自デザインのラジオボタン・チェックボックスを超簡単実装できるjQueryプラグイン:phpspot開発日誌

    Screw Default Buttons! | Custom Radio Buttons and CheckBoxes 独自デザインのラジオボタン・チェックボックスを超簡単実装できるjQueryプラグイン。 ONかOFFの状態の2枚の画像を用意してjQuery関数で初期化するだけで簡単に独自デザインのものが作れます。 実装コード例。超簡単ですね。 追加のCSSでよりスタイルを独自に変えることも可能です 関連エントリ 独自デザインのスクロールバーにする際に使えるjQueryプラグイン「jScrollbar」 Youtube動画埋込みを独自デザインにしたい場合に使えるjQueryプラグイン「Custom Youtube Player」 独自デザインselectボックス実装時に使えそうなjQueryプラグイン「EasySelectBox」 CSS3で独自デザインの綺麗なボーダーを実装する例

  • EasyUI - helps you build your web pages easily

    Welcome to EasyUI EasyUI framework helps you build your web pages easily. GET STARTED What is EasyUI? easyui is a collection of user-interface components based on jQuery, Angular, Vue and React. easyui provides essential functionality for building modern, interactive, javascript applications. using easyui you don't need to write many javascript code, you usually define user-interface by writing so

  • クレジットカード番号をバリデートできるjQueryプラグイン「Smart Validate」:phpspot開発日誌

    jQuery Credit Card Format Valiation Plugin: Smart Validate | EGrappler クレジットカード番号をバリデートできるjQueryプラグイン「Smart Validate」。 jQueryプラグインでフロントエンド側でデータのバリデーションが行えます。 あくまでフロントエンド側のチェックなのですが、入力ミスを防げるのは便利そうです エラーの場合はアラートを表示したり独自の処理がイベントハンドラにかけるようになっています コードは次のように書けて超簡単 関連エントリ HTML5動画に字幕が付けられるjQueryプラグイン「Cuepoint.js」 かなりクールなjQueryのメニュープラグインやチュートリアル集 3つの状態を保持できるフォームエレメント実装jQueryプラグイン「jQuery 3 State Switch」 小さく

  • はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知

    はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28

    はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
  • jQuery プラグインを書くための資料と便利ツール - わからん

    次の3つが役立っている。最近実際にいくつか読んでいるけど、複数ブラウザ対応していたり、完成度の高いものばかりというわけではないんだなと知った。そのことにネガティブな印象はなくて、そのまま使えるものじゃなくても、公開して頂けるだけありがたいといった気分。どうせなら GitHub に置いてくれれば、気軽に修正の報告ができるしいいなとは思った。 http://docs.jquery.com/Plugins/Authoring 公式サイトの Plugins/Authoring というセクションに丁寧な解説がある。 http://stefangabos.ro/jquery/jquery-plugin-boilerplate-revisited/ テンプレ。コメント付きのほうを一度読み下すだけでも、ためになった。わざわざこのネタのための RSS フィード もあった。 http://jquery.cod

  • 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プラグイン「jQuery Timer」:phpspot開発日誌

    jQuery Timer Demo タイマーを作る際に便利なjQueryプラグイン「jQuery Timer」。 単純に、指定エレメントの値を指定秒数で+していくタイマーの実装がjQueryのプラグイン形式で簡単にできるものです。 setIntervalとかでやっちゃえばいい話なのですが、オブジェクト指向っぽく使えて後から見たときのコードも分かりやすくできます。 var myTimer = $.timer(); myTimer.set({ action : function() { alert('This message was sent by a timer.'); }, time : 5000 }).play(); myTimer.set(options); myTimer.play(); myTimer.pause(); myTimer.toggle(); myTimer.once(

  • もっと少量のjQueryコードでHTMLテーブルの列にリンク先を指定できるようにする方法

    ちょっとしたコードの解説 せっかくなので、どういうコードなのかというのを、さらっとみましょう。 jQuery(function($) { //data-hrefの属性を持つtrを選択しclassにclickableを付加 $('tbody tr[data-href]').addClass('clickable') //ata-hrefの属性を持つtrをクリックしたら動作 .click( function() { //data-href属性の値をattr()メソッドで取得し、ページを遷移させる window.location = $(this).attr('data-href'); //もしtr内にa要素があれば、a要素にホバーした時に以下動作させる }).find('a').hover( function() { //a要素の先祖要素trのクリックイベントを解除 $(this).paren

    もっと少量のjQueryコードでHTMLテーブルの列にリンク先を指定できるようにする方法