js

(記事数 13)

jQuery deferredを使い、javascriptの confirm をカスタマイズ 4

jQuery deferredを使い、javascriptの confirm をカスタマイズ 3の続編です。 使っていたjsのmixinにバグがあったので、素直に、$.extend を使うように変更しました。また、optionのdefaultの構造も変更しました。 DEMO confirm confirm 1 confirm 2 alert alert 1 alert 2 textarea プラグ

jQuery deferredを使い、javascriptの confirm をカスタマイズ 3

jQuery deferredを使い、javascriptの confirm をカスタマイズ 2の続編です。 jQueryのfadeInが思ったように機能しなかったため、フェードインのアニメーションをCSS3で行うようにしました。 DEMO confirm confirm 1 confirm 2 alert alert 1 alert 2 textarea プラグイン confirmDialog.

jQuery deferredを使い、javascriptの confirm をカスタマイズ

confirm キャンセル はい jQuery(function($){ var site = {}; site.confirmHtml = $('#js-confirm')[0].outerHTML; $('#js-confirm').remove(); site.customConfirm = function(textHtml) { var d = new $.Deferred; $('bo

js スニペット と メモ

aがundefinedかどうか if (typeof a === "undefined") { // } 以下の全てがfalseと判断される if (undefined) { // 実行されない } if (null) { // 実行されない } if (0) { // 実行されない } if ('') { // 実行されない } if (false) { // 実行されない } 画像のプリロード

js 画像をドラッグ ドロップで ブラウザに表示する

DEMO DEMO 仕様 option var defaults = { MAX_LNGTH : 1,//一度にドラッグできる数 MAX_SIZE : 1,//ファイルサイズの最大値(MB) accept : 'image/gif, image/jpeg, image/png',//拡張子制限 input : $el.find('.imagedragdrop_file'),//inputを指定 o

jsでform要素の1つのselectを初期化する方法

demo 選んでください選択肢1選択肢2選択肢3選択肢4 選んだoptionは、選択肢– –です。 $(function(){ $('#select').on('change',function(){ $('#selected').html(this.options[this.selectedIndex].value); this.selectedIndex = 0; })

jsのappend for文 高速化

append 複数回か、1回で行う、どっちが早い DOMの操作を行う処理などを一度変数に格納して、1回で実行できるようにすれば、高速化することができる。 複数回に分けて append var i = 100; console.time(); while (--i) { $('body').append(''); }; console.timeEnd(); // default: 11.127929

jsの配列の追加、削除、結合、取得など

javascriptの配列(array)の基本的な使い方についてのメモです。 追加 先頭、末尾、任意の位置に、要素を追加します。 先頭に追加 unshift 配列の先頭に値を追加 var array = ['b', 'c']; array.unshift('a');// ['a', 'b', 'c'] 末尾に追加 push 配列の末尾に値を追加 var array = ['a', 'b']; ar

jsでオブジェクト の数(要素数)の数を取得する

オブジェクトの要素数が知りたいときがあったので調べたことのメモです。 var obj = { abc : 'def', ghi : 'jkl', mno : 'pqr', stu : 'vwx', y : 'z' }; var objNum = Object.keys(obj).length; console.log(objNum); // 5 //なお、Object.keys(オブジェクト名)は

関数とか、その呼び出し方のメモ

基本 コメントアウト ひとかたまりのコードをコメントアウトする際、正規表現の記述とバッティングする可能性があるため コメントアウトは、/**/よりも//を使う。 オブジェクトリテラル var neko = { koe : { sono1 : 'にゃんにゃん', sono2 : 'にゃーん' }, kazu : 2, hi : '2017-02-18' }; オブジェクトの取り出し方 neko.hi

Riot.jsをほんの少し触ってみる

「jQuery + React のような js」 それが、Riot.js。 自分の廻りでも、脱jQueryの話が、昨年よりもまして話題になるようになったので、少しづつ、学んでいこうと思います。 サンプル コード <sample></sample> <script src="https://cdn.jsdelivr.net/riot/3.0.2/riot+compile

ユニクロ 2016 PC サイトトップ 雪のアニメーション canvas

ユニクロ おそらく、以下のjsが主要なjs $('body') .css({'position': 'relative'}) .append('<canvas id="backstage" class="canvas" style="position:fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: -1;dis

jsでお知らせ、簡易的な通知

このリンクをクリックすると、お知らせが出てきます。 ちかいうちに、プラグイン化してグローバルメソッドで呼べるようにしたい。 //html <div id="box_notifications" data-notification-favorite="true"> <div class="notifications_inner"> </div> </div&


  1. KATOON.NET
  2. タグ : js