Replace the jQuery Document Ready Function with JavaScript — SitePoint
The jQuery document ready ($(document).ready()) method was implemented to execute code when the DOM is fully loaded. Since it executes the given function when all DOM elements are available, you can be sure that trying to access or manipulate elements will work. Before jQuery 3.0, the typical usage with a anonymous function looked like this: $(document).ready(function() { // Handler for .ready() c
Midnight.js - Switch fixed headers on the fly
Midnight.js lets you switch fixed headers on the fly Scroll to try it out! The Header Create your fixed nav (or header) as you typically would. You can use whatever markup suits you, just make sure the header works well with position:fixed. The Sections After that, take any sections of your page that need a different nav and add data-midnight="your-class" to it, where .your-class is the class you
URI.js - URLs in Javascript
URI.js is a javascript library for working with URLs. It offers a "jQuery-style" API (Fluent Interface, Method Chaining) to read and write all regular components and a number of convenience methods like .directory() and .authority(). URI.js offers simple, yet powerful ways of working with query string, has a number of URI-normalization functions and converts relative/absolute paths. While URI.js p
jQuery 公式 Blog 「jquery-latest.js を使用するのをやめろ」
jQuery 公式 Blog は、「Don't Use jquery-latest.js」 と題された記事内で、今後、jquery-latest.js のバージョンを 1.11.1 で固定することと、本番環境で jquery-latest.js を読み込むのをやめてくれというアナウンスを行っています。 jQuery 公式 Blog は、7月 3日付けで投稿された 「Don't Use jquery-latest.js （jquery-latest.js を使うな）」 と題された記事内で、今後、jquery-latest.js のバージョンを 1.11.1 で固定することと、本番環境 （公開している Web サイト） で jquery-latest.js を読み込むのをやめてくれというアナウンスを行っています。 Don't Use jquery-latest.js ： Official jQ
Headroom.js - Give your pages some headroom. Hide your header until you need it.
Headroom.js Give your pages some headroom. Hide your header until you need it. Or install via npm/yarn: npm install headroom.js --save yarn add headroom.js What's it all about? Headroom.js is a lightweight, high-performance JS widget (with no dependencies!) that allows you to react to the user's scroll. The header on this site is a living example, it slides out of view when scrolling down and slid
ScrollMagic
ScrollMagic helps you to easily react to the user's current scroll position. It's the perfect library for you, if you want to ... animate based on scroll position – either trigger an animation or synchronize it to the scrollbar movement (like a playback scrub control). pin an element starting at a specific scroll position – either indefinitely or for a limited amount of scroll progress (sticky ele
Velocity.js
Overview Velocity is an animation engine with the same API as jQuery's $.animate(). It works with and without jQuery. It's incredibly fast, and it features color animation, transforms, loops, easings, SVG support, and scrolling. It is the best of jQuery and CSS transitions combined. Download Download Velocity, include it on your page, and replace all instances of jQuery's $.animate() with $.veloci
William Newton
I create experiences that people love. Most recently I worked with several teams at Gusto, designing new financial products for employees. Previously I worked with a talented team to create a DJ app that people love called Crossfader. I designed a little app Breathe to help people practice mindfulness, which (funny story!) is no longer around. Nights and weekends I make make dance music with my re
Chosen: A jQuery Plugin by Harvest to Tame Unwieldy Select Boxes
Hide Search on Single Select The disable_search_threshold option can be specified to hide the search input on single selects if there are n or fewer options. $(".chosen-select").chosen({disable_search_threshold: 10}); Default Text Support Chosen automatically sets the default field text ("Choose a country...") by reading the select element's data-placeholder value. If no data-placeholder value is
Creating upload button and progress bars using jQuery-File-Upload plugin
All markup must be wrapped in a form, here's the markup for the form. <form id="fileupload" action="/path/to/your/controller/ext" method="POST" type="multiplart/form-data">...everything below this goes in here </form> This is the markup for creating a 'Start Upload' button. <button class="btn btn-primary start" type="submit"> <span>Start upload</span> </button> Here's the markup for creating a 'Ad
そのコード、本当にjQueryが必要ですか？ネイティブ関数の代替Tips集 | ゆっくりと…
sitepoint から「本当にjQueryが必要ですか？」とタイトルのついた3本の記事を紹介します。 Do You Really Need jQuery? Native JavaScript Equivalents of jQuery Methods: the DOM and Forms Native JavaScript Equivalents of jQuery Methods: Events, Ajax and Utilities 言うまでもなく著者の Craig Buckler さん の趣旨は、「jQueryを使うのは止めよう」ではありません。ネイティブ関数で代替えできるのは、古い IE のサポートが必要なく、ごく簡単なケースに限られます。その代わりに得るものは「速さ」です。そこで、どの程度「速い」のかを所々 jsperf の結果で補ってみたいと思います。 また JavaScri
jQuery : 要素の操作は必ずAPIを使うべし : typeOf 'aki_mana'
身近なところで話題になったので。 過去にも、「empty() とか remove() するより、DOMオブジェクトにアクセスして innerHTML = ”” した方が速いよ！」というブログエントリを投下する方が多かったのですが、「必ずAPIを使う」こと。 理由は、「メモリリークの温床だから」 GitHub で manipulation.js のソース読めば判るとおり、結構頻繁に jQuery.cleanData() が実行されてます。― jQuery.cleanData() メソッドは、data() API として独自に実装された「各要素と紐づけられるキー・バリューストア（メモリストア）」に対する処理なので、innerHTML を使う場合でも、jQuery.cleanData() を使うなら、まぁ問題無いです。 要するに、jQuery （Zeptoみたいな類似ライブラリもそう）は、常にH
"Thinking in AngularJS" if I have a jQuery background?
1. Don't design your page, and then change it with DOM manipulations In jQuery, you design a page, and then you make it dynamic. This is because jQuery was designed for augmentation and has grown incredibly from that simple premise. But in AngularJS, you must start from the ground up with your architecture in mind. Instead of starting by thinking "I have this piece of the DOM and I want to make it
How to capture the browser window close event?
I want to capture the browser window/tab close event. I have tried the following with jQuery: jQuery(window).bind( "beforeunload", function() { return confirm("Do you really want to close?") } ) But it works on form submission as well, which is not what I want. I want an event that triggers only when the user closes the window.
innerHTMLとjQuery.text()の間のDOMNodeInsertedとDOMSubtreeModifiedの挙動の違い - koroharoの日記
Chrome拡張作ってて、ある要素のテキストの変更を監視しようとしたときに気づいたのでメモ。 書いてあること以上のことは調べていない。*1 要素内のテキストをjQuery.text()で変更している場合と、innerHTMLで変更している場合とで発生するDOMNodeInsertedとDOMSubtreeModifiedに差異があってなんだかなーなんだかなーという話。 とあるh1要素の変更を監視するため、以下のように DOMNodeInsertedとDOMSubtreeModified を設定。 document.querySelector('div.foo h1').addEventListener('DOMNodeInserted', function(e){ console.log('***DOMNodeInserted:' + e.srcElement.constructor.na
jQuery で HTTP 接続するときの書き方: Days on the Moon
12 月 13 日に Kyoto.js の第 3 回 meetup で、「jQuery で HTTP 接続するときの書き方」と題した 5 分間のライトニングトークを行いました。以下にその内容を一部再構成して収録します。 こんにちは、nanto_vi です。今日は jQuery で HTTP 接続をするときの書き方について話します。 皆さん jQuery を使うことも多いかと思います。jQuery で HTTP 接続をするとき、古いサンプルだと次のような書き方が載っています。 $.ajax({ url: '/foo/bar', data: { baz: 'qux' }, success: function (data) { console.log(data); }, }); 接続完了時の処理をコールバック関数として $.ajax() に渡してやる形ですね。しかし、現在この書き方は非推奨となっ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - polygonplanet/Pot.js: Pot.js is an implemental utility library that can execute JavaScript without burdening the CPU.
cmsauve.com
http://oridomi.com/
Thematic WordPress Theme Toolbox: 10 extremely useful hooks