Redirecting… Click here if you are not redirected.
Redirecting…
Redirecting… Click here if you are not redirected.
Magnific Popup: Responsive jQuery Lightbox Plugin
Magnific Popup is a responsive lightbox & dialog script with focus on performance and providing best experience for user with any device (for jQuery or Zepto.js). Important note: This jQuery plugin is deprecated, only critical or security bug fixes will be released in future. Use native <dialog> element if you need a basic dialog/modal/popup, or my PhotoSwipe library if you need an advanced image
Intersection Observer を用いた要素出現検出の最適化 | blog.jxck.io
Intro スクロールによる DOM 要素の出現などを効率よく検知するため、新しく Intersection Observer という API が追加された。 この API の使い方と、本サイトへの適用について記す。 要素交差(intersection)の検出 ページをスクロールしていく過程で、特定の DOM が画面に出現したことをフックしたいケースがある。 代表例は 画像の遅延読み込み であり、初期ロードでは画像の取得を行わずスクロールしていく過程で順次取得する手法である。 特に画像の多いページでは表示に必要なリソース取得のみに最適化でき、初期画面表示などでは効果が大きいとされる。 これを実装するのに必要なのは、「 <img> 要素が出現しているかどうか」であるが、本質的には「画面外にあった <img> が viewport と交差したか」を取得することになる。 つまり、 要素出現の取得
現場で使えるアニメーション系JSライブラリまとめ(2018年版) – TweenMax, CreateJS, WebAnimation, Velocityなど - ICS MEDIA
現場で使えるアニメーション系JSライブラリまとめ GSAP, CreateJS, WebAnimation, Velocityなど ウェブサイトのインタラクションやUIの振る舞いなど、HTMLでモーションを実装する機会は多々あります。HTML要素の簡易的なアニメーションであればCSS Transitionを使ったことのある方も多いでしょう。しかし、WebGLやCanvas、SVGなどJavaScriptが実装の中心となる制作作業では、CSS Transitionでは対応しきれず、アニメーションライブラリ（トゥイーンライブラリとも言います）が必要となる場面があります。 JavaScriptのアニメーションライブラリは多種多様なので、どのライブラリを採用するのか悩みどころ。本記事ではHTMLのJavaScriptライブラリについて、使い勝手や書式を紹介します。 今回紹介するメジャーなJSライブ
「JavaScript初級者のためのコーディングガイド」に補足を試みる - Qiita
はじめに http://qiita.com/raccy/items/bf590d3c10c3f1a2846b を見ていたら、はてブに「理由がないから」ということがよく挙がっていたので、理由をつけてあげたら有益な内容になるかな？と思い、拙いながらも補足を試みようと思います。 【2017 1/3 15:10 追記】 元記事の前提はgulpなどを使ってminifyなども行なえる（もしくは行う目標がある）前提の様子なので、中級者以上がターゲットかなーと思いました。そのつもりで読むととてもいい記事だと思っています。 「最新のJSの書き方を覚えてあとは変換機能に任せればレガシーなJSのキツイところに向き合わなくて済みますよ？」みたいなイメージだとわかりやすいかな？ ==、!= 理由 暗黙の型変換が発生して、別の型の比較が真で扱われてしまう場合があるため。 解説 サンプルコードにも出ていますが言葉足らず
JavaScript初級者のためのコーディングガイド - Qiita
JavaScriptは大変難しい言語です。Rubyの難易度を2、Cの難易度を5、C++の難易度を8にすると、JavaScriptの難易度は12ぐらいあると思います。このコーディングガイドはそんなJavaScriptの深みに嵌まらないようにするためのJavaScriptの書き方を規定したものです。初級者1のための物ですので、わかってやっている人に好きにやってください。 このコーディングガイドは絶対に従わなければならないものではありません。私は一切強制はしませんし、初級者が従わなければならないという義務もありません。採用するしないはみなさんの自由です。 禁止編 JavaScriptには安易に使用してはいけない機能があります。下記の機能は、**それぞれの機能を使っても良い、または、使うべきであるという理由を説明できない限り、**使用してはいけません。 ==、!= ==と!=を使用してはいけません
知らなきゃ損する！Web開発で絶対使いたくなる、人気のJavaScriptライブラリ8選と導入方法を公開 -
どうも、まさとらん（@0310lan）です。 今回は、毎日のように誕生する新しいJavaScriptライブラリの中から、思わず使ってみたくなるようなオススメのライブラリを厳選してご紹介しようと思います。 そのままWebアプリとして活用できそうなモノから、コードの書く量を大幅に減らしてくれたり、ユーザー体験を一気に向上してくれるモノまで、幅広いジャンルをまとめていますので、ご興味ある方はぜひ参考にしてみてください！ ■入力された内容を自動検証する！ 【 Cleave.js 】 フォームなどでよく使う「inputタグ」で、何が入力されたかを検証して意図しないデータ入力を簡単に防ぐことができるのが「Cleave.js」です。 使い方は非常にシンプルで、例えば「電話番号」を入力する「inputタグ」があったとします。 <input type=”tel” id=”input-tell” /> 「in
『JavaScript: The Good Parts』で紹介されている標準メソッドまとめ - Qiita
『JavaScript: The Good Parts』で紹介されている標準メソッドまとめ JavaScript: The Good Parts ―「良いパーツ」によるベストプラクティスは、JavaScriptの「良いパーツ」のみを厳選した、JavaScriptを書く人なら一度は読んでおきたい 良書です。したがって、ここで紹介されている標準メソッドは、積極的に取り入れるべきメソッドです。 「車輪の再発明はするな」とはよく言われることですが、標準APIに詳しくなることで普段書くJavaScriptもかなりきれいにまとまって書けるようになります。 本記事では省いているRegExpやNumberの節、または標準メソッド以外のJavaScriptの「良いパーツ」に興味が出た方は、一度本書を手にとって見てみてください。 「JavaScriptは言わばひとかたまりの大理石であり、私はその中からこの言語
EJS -- Embedded JavaScript templates
What is EJS? What is the "E" for? "Embedded?" Could be. How about "Effective," "Elegant," or just "Easy"? EJS is a simple templating language that lets you generate HTML markup with plain JavaScript. No religiousness about how to organize things. No reinvention of iteration and control-flow. It's just plain JavaScript. Use plain JavaScript We love JavaScript. It's a totally friendly language. All
clipboard.js
Why Copying text to the clipboard shouldn't be hard. It shouldn't require dozens of steps to configure or hundreds of KBs to load. But most of all, it shouldn't depend on Flash or any bloated framework. That's why clipboard.js exists. Install You can get it on npm. npm install clipboard --save Or if you're not into package management, just download a ZIP file. Setup First, include the script locat
ユニークな見せ方や動きを実装したい時に使えそうなスクリプト 10 - NxWorld
他ではあまり見かけることのないユニークな見せ方や動きを実装したいとき、遊び心あるイースターエッグを仕込んでおきたいときなどに個人的に使えそうだなと思ったスクリプトをまとめてみました。 ブラウザやデバイスによっては実装できないものも幾つかあるのでその点は注意が必要ですが、いずれもそこまで難しい記述などもなく実装することができます。 窓に水滴がついていく様子を表現できる「rainyday.js」 とにかく実際に動いているデモを見てほしいのですが、雨が降って窓に水滴が徐々についていく様子をリアルに表現することができるスクリプトです。 水滴のサイズやついていくスピード、ぼかしや不透明度具合を調整することができます。 水面に滴が落ちているような感じを表現できる「Raindrops.js」 コンテンツやセクションの区切りなどを水面に見立て、そこに滴が落ちてきたようなエフェクトを実装できるjQueryプ
タイルレイアウトjsIsotope
Install Download isotope.pkgd.js un-minified, or isotope.pkgd.min.js minified CDN Link directly to unpkg. <script src="https://unpkg.com/isotope-layout@3/dist/isotope.pkgd.js"></script> <!-- or --> <script src="https://unpkg.com/isotope-layout@3/dist/isotope.pkgd.min.js"></script> Package managers Install with npm: npm install isotope-layout Install with Bower: bower install isotope-layout --save
JavaScript 言語概要 - JavaScript | MDN
JavaScriptチュートリアルBeginner's tutorialsYour first website: Adding interactivityDynamic scripting with JavaScriptJavaScript frameworks and librariesJavaScript ガイド入門編文法とデータ型制御フローとエラー処理ループとイテレーター関数式と演算子数値と文字列日付と時刻の表現正規表現インデックス付きコレクションキー付きコレクションオブジェクトの利用クラスの使用プロミスの使用JavaScript 型付き配列イテレーターとジェネレーターリソース管理国際化JavaScript モジュール中級編Advanced JavaScript objectsAsynchronous JavaScriptClient-side web APIs言語概要JavaScr
最近のWebページで使用されている『さまざまな魅せ方』を実装するCSSやJavaScriptの最新チュートリアルのまとめ
最近のWebサイトやブログで見かけるアニメーションを使ったさまざまなかっこいいエフェクトやコンテンツの見せ方を実装するCSSやJavaScriptのチュートリアルをCodyHouseから紹介します。 それぞれファイルを一式でダウンロードできるので、すぐに利用できます。 Fixed Background Effect デモページ 対応ブラウザ：Chrome, Safari, Firefox, Opera, IE9+ sectionやdivを垂直に配置した縦長ページで、背景を固定し、各コンテンツがカーテンを引き上げるようにスクロールするシンプルなテンプレート。
JavaScriptユーザエージェント判別・判定
Updated 2015.11.24 / Published 2015.04.02 新しいFirefox OSやWindows Phoneを含めた2015年現在のユーザエージェントを判定し分岐処理を行う手順をご紹介します。OSや機種毎の処理を行っていくには、もはや無理がありますので、タブレットかスマートフォンかを判別することのみにフィーチャーしています。 ユーザエージェント情報に依存して、分岐処理を行うと、常に付きまとう悩みの種が新しいOSの登場です。今年もすでにauからFirefox OSを搭載したスマートフォンであるFx0が新たに登場し、次いで日本国内でもWindows Phoneが発売されることが決まっており、ユーザエージェント情報に依存して処理を行っている部分は相次いで見直しを迫られることになりますので、以下、ご参考に活用いただければと思います。 var _ua = (functi
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScript つい忘れてしまう配列のソート方法 - Qiita
IEで NodeList を forEach するとエラーになる問題の対処方 - Qiita
JavaScriptを読んでて「なにこれ！？」と思うけれど調べられない記法8選。 - Qiita
jswatchdog
1216彩票-官网平台