anime.jsAnime.js (/ˈæn.ə.meɪ/) is a lightweight JavaScript animation library with a simple, yet powerful API. It works with CSS properties, SVG, DOM attributes and JavaScript Objects. Getting started
入力チェック（正規表現含む）｜formオブジェクト｜JavaScript/DOM｜PHP & JavaScript Room
<script type="text/javascript"> /** * [関数名] chkRegEmail * [機 能] 正規表現によるメールアドレス（E-mail）チェック * [引 数] * @param str 入力された文字列 * [返り値] * @return true(E-mail形式である場合) | false(E-mail形式でない場合) */ function chkRegEmail(str){ /* E-mail形式の正規表現パターン */ /* @が含まれていて、最後が .(ドット)でないなら正しいとする */ var Seiki=/[!#-9A-~]+@+[a-z0-9]+.+[^.]$/i; /* 入力された値がパターンにマッチするか調べる */ if(str!=""){ if(str.match(Seiki)){ alert(str.match(Seiki
JavaScriptでGIFアニメーションを繰り返し読み込むときの注意点
読み込んだGIFアニメーションをキャッシュすることによる問題点 画像ファイルというのは特に何もしなければ画像は読み込み後にブラウザにキャッシュされ次回同じものを表示するときはキャッシュが表示される。 サーバー側の負担を減らし、ユーザー側の表示速度を上げるための仕組みだがGIFアニメーションの場合、ブラウザを更新せずにJavaScriptで再度読み込むとアニメーションが終了した状態で読み込んでしまうため都合が悪いことがある。 例えば下記のコードのようにボタンをクリックしてGIFアニメーションを読み込む場合、1回目は最初から再生されるが2回目は再生終了後（あるいは再生途中）の画像が表示されてしまう。 $("#s1").click(function(){ $("#r1").append('<img src="count3.gif">'); }); そのためGIFアニメーションを毎回呼び出した時に
Class構文について - JS.next
概要 待ち焦がれた人も多いことだろう。ES2015の一番の目玉機能とも言えるクラス構文が、ついにV8でサポートされた。 Class構文は、『関数（コンストラクタ）定義』＋『.prototypeへのメソッド定義』の糖衣構文である。 JSで今まで様々に工夫されてきたクラスの書き方を、綺麗に統一してくれる可能性を秘めている。 クラスを作る 従来、Catクラスを作ろうとした場合このように書いてきた。 function Cat(name) { this.name = name } Cat.prototype.meow = function () { alert( this.name + 'はミャオと鳴きました' ) } しかしこの書き方だとどうしても、コンストラクタとメソッドの定義が分離されているため、クラスとしてまとまりがなく分かりづらく感じる。 メソッドが増えてきた時も、Cat.prototyp
JavaScriptライブラリTweenMaxでSVGアニメーションを扱う方法 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
SVGDOMのプロパティを変更 それでは、さっそくSVGDOMの操作方法について記載していきます。 <rect id="rect" x="50" y="50" width="100" height="100" fill="#91e600" /> TweenMax.to($element,0.5,{attr:{x:100,y:150}); 指定した要素のx,y座標がアニメーションで変化していますね。viewBoxの指定方法については、後述します。 原点を固定してアニメーション transformOriginとsvgOriginを使ったアニメーション方法について説明します。 CSSで用いられるtransform-originは、要素の原点を変更することができるプロテパティです。 TweenMaxでも同じように各要素の原点を指定する場合は、transformOriginに値を渡すことで原点を変更
jQueryでページ上の座標（X座標／Y座標）を取得する方法｜BLACKFLAG
Webページ上でカーソル位置やクリックされた位置によって ポップアップを出したりモーダル位置を調整したりツールチップを出したり いろいろと処理を加えることがあると思います。 そんな際のページ上のポイント位置の座標（X座標／Y座標）を取得して 位置を調整する処理方法を簡単に紹介してみたいと思います。 jQueryでページ上の座標（X座標／Y座標）を取得する方法【ページ全体の場合】 ページ上のX座標・Y座標を取得するには —————————– X座標 = e.pageX Y座標 = e.pageY —————————– を使って値を取得することができます。 各座標の値を取得するサンプルとして ページ上のクリックされた位置のX座標／Y座標を取得してみると。 ページ上のクリックされたポイントのX座標／Y座標を取得（別枠で表示されます）※別枠で表示される画面内をクリックしてみてください。 クリックさ
SVG Morpheus - Morph SVG icons
JavaScript library enabling SVG icons to morph from one to the other. It implements Material Design's Delightful Details transitions. View on GitHub
クロスフェードするスライドショー（ナビゲーションボタン付き） | nagachan.net
jQueryを使った、クロスフェードするスライドショーを自作してみました。 いろんなサイトでも見かけるかと思いますが、お勉強のために自作です。 ■作りたい仕様 一定時間で画像が切り替わるスライドショー クロスフェードのような処理をさせたい 指定した画像に直接切り替えられるボタンもつけたい 切り替えたい画像をリストに配置すれば、切り替えボタンは自動生成されます。 クロスフェードでなく、一旦画像を消してフェードインさせるのであればもっと簡単にできますね。 今の所、ナビボタンに画像が２桁になった処理を入れていないので、写真の数は９個までしか配置できませんw そのうち改良します・・・。 デモはこちら HTML <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javas
JavaScriptのfor文の中で、カウンタ変数を利用する関数をジェネレートするいくつかの方法 - あと味
for文の中で、カウンタ変数を利用する関数を作るとき、はじめは必ずハマるであろうことが予想できます。 私も実際にハマったことが多々あります。 本エントリーでは、for文の中で、カウンタ変数を利用する関数をジェネレートするいくつかの方法を提示したいと思います。 問題のあるコード 以下のコードがfor文の中で、カウンタ変数を利用する関数をジェネレートするコードです。for文を1から5まで繰り返し、配列の中にカウンタ変数を出力する関数を格納していきます。関数が格納された配列をさらにfor文で走査し、1から5まで出力することを意図しています。 素直にコーディングすると、まずうまくいきません。 var func_list = []; for (var i = 1; i < 6; i++) { func_list.push(function() { return console.log(i); });
ホームページ制作なら渋谷のウェブ制作会社【スタイル】
【スタイル】は東京都渋谷区でホームページ制作を行うウェブ制作会社です。ウェブサイト制作、SEO対策、ウェブマーケティングなどを承っています。良質テンプレートでの格安ホームページ制作プランもあります。
Online JavaScript beautifier
End script and style with newline? Support e4x/jsx syntax Use comma-first list style? Detect packers and obfuscators? (unsafe) Preserve inline braces/code blocks? Keep array indentation? Break lines on chained methods? Space before conditional: "if(x)" / "if (x)" Unescape printable chars encoded as \xNN or \uNNNN? Use JSLint-happy formatting tweaks? Indent <head> and <body> sections? Keep indentat
androidでoverflow:scrollがきかないのをjavascript（jQuery）で解決する : 森のコーディング
5月8 androidでoverflow:scrollがきかないのをjavascript（jQuery）で解決する カテゴリ:jQueryandroid Tweet ※一部ソースが間違えていたので修正しました[20131028] サイトをつくっていて、特定の領域だけスクロールさせたいとき、 要素をdivでかこんで overflow:scroll; などとします。 スマホ用サイトでも、使うことはちょくちょくあるのですが、なんとandroidでは、overflow:scrollがきかずに、強制的にoverflow:hidden;になってしまうというバグが。 それを解決するライブラリも半日探したけれど見つからず、、 しょうがないのでjavascriptを自分で書いて解決してみたら、 思いの外簡単だったので、共有しときます。 基本的にはコピペでいけると思います。 javascript部分（というか
HugeDomains.com
Captcha security check actyway.com is for sale Please prove you're not a robot View Price Processing
MDN Web Docs
Resources for Developers, by DevelopersDocumenting web technologies, including CSS, HTML, and JavaScript, since 2005. //////////// //////////// //////////// //////////// //////////// //////////// //////////// ++++++ ++++++ ++++++ ++++++ ++++++ ++++++ ++++++{{{{ }}}} {{{{ }}}} {{{{ }}}} {{{{ }}}} {{{{ }}}} {{{{ }}}} ../../ ../../ ../../ ../../ ../../ ../..
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Blast.js: Javascript Library for Creative and Safe Text Manipulation
Vague.js
株式会社Trys
ユーザーエージェントによってPCとスマートフォン（iPhone / Android）を振り分ける方法いろいろ