An all-in-one wizard plugin that is extremely flexible, compact and feature-rich. Download
jQuery 3.0 is now released! This version has been in the works since October 2014. We set out to create a slimmer, faster version of jQuery (with backwards compatibility in mind). We’ve removed all of the old IE workarounds and taken advantage of some of the more modern web APIs where it made sense. It is a continuation of the 2.x branch, but with a few breaking changes that we felt were long over
注意とお願い この記事の内容はもはや古いです。ここに書いている方法では動かないものをいくつか見つけました。参考にする際は動作をよく確認してから使ってください。 ひとつお願いがあります。「あれ、動かないぞ」というコードを見つけたら是非コメントか編集リクエストで教えてください。解決方法までなくても結構です。「これはもう動かないよ」という印をつけたいのです。 この記事はYou Don't Need jQueryの日本語訳と同じ内容です。 先日ひょんなことからYou Don't Need jQueryの日本語訳をさせていただきました。著者のCam Songさんからも快諾をいただけたので1、Qiitaでも公開させていただきます。 なお、本家の英語の説明は継続的にメンテされているので、この記事の情報は古くなっている可能性があります。 追記 この記事は当初は「もうjQueryは必要ない」というタイトルで
スムーズスクロールのための jQuery プラグイン jquery.smoothScroll を公開しました 2015年12月04日 17:00JavaScript とあるプロジェクトでブラウザのページ内リンクをスムーズにスクロールさせたいということになって、既存のライブラリがどうも思ったようにならないようだったので、簡単につかえるやつをつくりました。 msng/jquery.smoothScroll ページ内リンクが自動でスムーズスクロールになるやつ。 特別なことをしたいのでなければこの上なく簡単に使えると思うし、ある程度は特別なことができるようにもしてあります。 まあ車輪の再発明という感じがしないでもないけど、既存のやつの何かうまくいかないところを修正するより作った方が早そうだったので。 簡単な使い方 最初にやること プラグイン本体を持ってってください。 msng/jquery.smo
他ではあまり見かけることのないユニークな見せ方や動きを実装したいとき、遊び心あるイースターエッグを仕込んでおきたいときなどに個人的に使えそうだなと思ったスクリプトをまとめてみました。 ブラウザやデバイスによっては実装できないものも幾つかあるのでその点は注意が必要ですが、いずれもそこまで難しい記述などもなく実装することができます。 窓に水滴がついていく様子を表現できる「rainyday.js」 とにかく実際に動いているデモを見てほしいのですが、雨が降って窓に水滴が徐々についていく様子をリアルに表現することができるスクリプトです。 水滴のサイズやついていくスピード、ぼかしや不透明度具合を調整することができます。 水面に滴が落ちているような感じを表現できる「Raindrops.js」 コンテンツやセクションの区切りなどを水面に見立て、そこに滴が落ちてきたようなエフェクトを実装できるjQueryプ
jQuery 1.9 を用いて textarea の現在のカーソル位置にテキストを挿入します。動作は IE 6 〜 9, Chrome, FireFox の最新版で確認。 function insertAtCaret(target, str) { var obj = $(target); obj.focus(); if(navigator.userAgent.match(/MSIE/)) { var r = document.selection.createRange(); r.text = str; r.select(); } else { var s = obj.val(); var p = obj.get(0).selectionStart; var np = p + str.length; obj.val(s.substr(0, p) + str + s.substr(p)); o
スポンサードリンク 概要 フォーム(form)の値を取得する場合、jQueryではval()メソッドやprop()メソッドを使う。 ただし、inputの種類によって癖があるので、各typeにおける「値取得」「値設定」などをメモする。 また、prop()を利用するのでjQueryのバージョンには注意が必要。 このコードを試したときのバージョンは「1.10.1」。 テキスト val()メソッドを使だけ。未入力の場合は、「""」(空文字)なので安全。 HTML <input type="text" name="animalText"> 値取得 var newText = 'トラ';$(':text[name="animalText"]').val(newText); 値設定 var animal = $(':text[name="animalText"]').val(); ラジオ val()メソ
input タグで画像を選んだら即時にプレビューを表示する jQuery iPreview プラグインを公開しました。 2013年12月17日 16:44JavaScript 最近のブラウザには File API というものが実装されていて JavaScript からファイルの情報を読み取ることができるので HTML の image[type=file] で画像を選んだときなんかに その場でプレビューを表示することもできますね。 これを使いたくてつついてたんだけど、 この処理を毎回書くのはめんどくさいので jQuery のプラグインにしました。 msng/jQuery.iPreview – GitHub JavaScript 書かない人も簡単に使えるようにしたつもりだし、 割と自由にカスタマイズできるようにもなってると思います。 jQuery iPreview でできること このボタンを押
TechOctave Transforms into Scythos - Your Brand Consultancy Partner At TechOctave, we’ve provided code snippets & AI-powered content solutions to brands for the past 5 years. But as of 2023, we are evolving into a new chapter as Scythos – your brand consultant partner for end-to-end growth strategies. As Scythos brand consultants, we now offer expanded services beyond SEO content creation includin
With one line of code.. new Card({ form: 'form', container: '.card'}) You get.. Animations for 4 different card types An intuitive experience for your users Pure CSS, HTML, and Javascript (no images) 100% free and open source No need to change your form Card works as a drop in addition to your current credit card form. No need edit input names or HTML — you can leave everything as is. All pure CSS
jQueryを用いて書いたコードと同等な働きをするコードをjQuery抜きで書くとどのようになるのかを示したWebサイト「You Might Not Need jQuery」(jQueryは必要ないかも)が先日話題になりました(はてなブックマークも180以上付いています)。 ちょうどこのWebサイトを話題にした記事「Choosing Vanilla JavaScript」が、Webデザイナ向けに情報発信をしている著名なWebサイト、A List Apartに掲載されていました。 Vanilla JavaScriptとは、要するに何もトッピングされていないバニラアイスクリームのように、jQueryなどのライブラリを使わない素のJavaScriptのことを示しています。 この記事は何でもjQueryを使うのではなく、正しい選択をしようというテーマの内容になっており、参考になりそうだったので翻訳
type: widget release: TBD priority: 0 - very low status: in planning documentation: N/A demo: N/A 1 - Description: Select a color based on a preset color palette (preset), visual rainbow (simple), or visual rainbow in addition to entering HEX, RGB, and HSV values for an advanced user mode. The default picker should be very compact and simple, ideally a rainbox picker or set of presets organzied in
こんにちは。荒井です。 Facebookもtwitterもgoogleも画面遷移のときには、非同期で次のページを読み込むような作りになってますね! これは、ajaxで次のページを読み込むのと同時に「History API」というHTML5の機能を使って、URLを更新することで実現してます。 毎回全部読み直さないから通常の画面遷移よりも早いし、URLが変わるから履歴に残るし、良いことばっかり!!SEO的にも「#!」を使ったやつより良いよっていうのを何かで読みました!!! これからWebサービスを作るなら、導入したいですね!!! これpjaxを使えば簡単に導入できるんです!!!よし!!! PJAX!! pjaxとは、GithubのChris Wanstrathって人が作ってるjqueryプラグインです。 上で説明した、History APIとajaxを使った非同期の画面遷移を簡単に導入すること
jQuery Mobile 1.4が正式版に。CSSインラインSVGのアイコンでRetina対応、DOM削減で動作の高速化も iOSやAndroidなどクロスデバイス対応のモバイルアプリケーション開発のためのJavaScriptライブラリ「jQuery Mobile」の最新版「jQuery Mobile 1.4」が公開されています。 CSS内のSVGでアイコンを描画 今回のバージョンの大きな特徴は、これまで画像ファイルを基に描画されてきたアイコンがすべてSVGに置き換えられたことで拡大縮小に対して柔軟になり、Retinaなど高精細な画面でもなめらかな表示を実現したことです。 例えば、jQuery Mobile 1.4でアイコン表示を備えたボタンをChromeのデバッガで見てみると、イメージファイルを示す部分にはSVGのコードがそのまま記述されていることが分かります。 これまであったPNG形
このテキストは JavaScript のコールバック地獄に疲れたひとのためのコールバック駆逐術指南書です。対象読者は JavaScript道初段くらいの人です。このテキストを読むと、以下のそれぞれの手段における非同期処理制御の仕組み、利点および欠点がわかるようになるかもしれません。 コールバック地獄 jQuery.Deferred async.js Concurrent.Thread generators co fibers Web Workers (※なぜか『進撃の巨人』の一部ネタバレが含まれるので注意してください) それは『何故人はコールバックするのか』という話でしょうか? 非同期処理って面倒ですよね。JavaScriptではいわゆる コールバック地獄 というやつにしばしば陥りがちです。たとえば、Ajax でふたつのファイル hoge.txt と piyo.txt を持ってきて、それら
追記:続編書きました。 リンクは一番下に 最近jQueryにはまっているひつじです。こんにちは。 jQueryに限らず、JavascriptでDOMをいじっていると var name = 'bsheep'; $('<div>').addClass('name').text(name).appendTo('#profile'); // // <div id="profile"></div> // ↓ // <div id="profile"><div class="name">bsheep</div></div> // こんな感じでDOMをその場で生成して埋め込みとかいう操作が結構あります。 でも、こういうの書いているとHTMLとscriptとを分離したくなってきますよね! この書き方のまま複雑なものとか作ってると、できあがりのHTMLの構造を読み取るための思考コストがかなり必
You asked for it, you got it: jQuery 2.0 has arrived! As promised, this version leaves behind the older Internet Explorer 6, 7, and 8 browsers. In return it is smaller, faster, and can be used in JavaScript environments where the code needed for old-IE compatibility often causes problems of its own. But don’t worry, the jQuery team still supports the 1.x branch which does run on IE 6/7/8. You can
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く