ウィンドウサイズで読み込むJavascriptを切り替える方法
パララックスのページを作成しているときにパララックスのjsが邪魔してたので、読み込まないようにする方法をまとめました。 ウィンドウサイズで読み込みJSの切り替えレスポンシブサイトの制作時にPCで読み込んでいるjavascriptを変更したいときに使用するコード。 PCサイトでパララックスのページを制作していて、スマホ表示では真っ白になる現象が起きたので、調べるとでparallax.jsが悪さしてるみたい。そこでスマホ表示のとき、つまりブラウザのウィンドウサイズが649pxのときにはparallax.jsを読み込まないようにしました。 <script type="text/javascript"> jQuery(document).ready(function($) { //PC環境の場合 if (window.matchMedia( '(min-width: 649px)' ).match
銀行コード、銀行名など金融機関情報の検索・自動入力API
[ポイント] ▼入力欄データから部分一致検索を行なう。 ▼検索キーは半角数字、半角ローマ字（最大6文字）、ひらがな（最大6文字）、漢字名称。 ▼ガイダンス画面の行選択で確定し、各欄に結果を自動入力します。 ※支店情報は銀行が決まってから動作する。 ※入力欄右端の「×」クリックでデータ削除。 ▼使い方はjavascriptファイルを1行追加。 ▼特記事項としてid名を合わせること。 （bank_code、bank_name、branch_code、branch_name） ▼標準で最大3箇所に設置できます。 [データの更新について] ▼無料版は、当方が気付いた時に手動で行います。 ▼有償版は、下記データソースの更新に合わせて自動で行います。 ▼金融機関情報のデータソースは、角谷様のページ データを利用させて頂いております。 ▲ページの先頭へ ◎BankAutob.js の利用方法 【 事前準
jQueryで入力フォームに文字カウント（カウントダウン）を設置する方法｜BLACKFLAG
今やTwitterで有名になった、入力フォームに文字を入力した際のリアルタイム文字カウント表示。 この様なINPUTやTEXTAREAに入力されたテキストの文字数を数えるには jQueryの「$(●●●●).val().length;」を使うと簡単に取得することが出来るようだったので 文字カウント、カウントダウンのいろいろな取得パターンを作ってみました。 jQueryで入力フォームに文字カウント（カウントダウン）を設置【SAMPLE１】 まずは単純に入力された文字数を表示するパターン。 HTMLには文字数を表示するエリアと 入力フォーム（ここではTEXTAREA）を設置します。 ◆HTML <span class="count">0</span> <textarea name="textarea" rows="10" cols="30"></textarea> CSSは特に動作には関係しな
[JS]スマホやタブレットのタッチデバイスでの操作がめちゃ快適な画像ギャラリーのスクリプト -PhotoSwipe
サポートするタッチジェスチャーの一覧 PhotoSwipeの使い方 Step 1: 外部ファイル 当スクリプトとスタイルシートを外部ファイルとして記述します。 <!-- Core CSS file --> <link rel="stylesheet" href="path/to/photoswipe.css"> <!-- Skin CSS file (optional) --> <link rel="stylesheet" href="path/to/default-skin/default-skin.css"> <!-- Core JS file --> <script src="path/to/photoswipe.min.js"></script> <!-- UI JS file --> <script src="path/to/photoswipe-ui-default.min.j
![[JS]スマホやタブレットのタッチデバイスでの操作がめちゃ快適な画像ギャラリーのスクリプト -PhotoSwipe](https://cdn-ak-scissors.b.st-hatena.com/image/square/d65d654192b6c35de8b5e9ca6ebde66452cbfe56/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201404%2F2014121601.png)
WebPJS - Google's new image format WebP for not supported browsers (with alpha-channel)
WebPJS Home Examples & Downloads Examples without WebPJS Libwebpjs Introduction libwebpjs first release libwebpjs 0.1.2 libwebpjs 0.1.3 NEW!!! libwebpjs 0.6.0 NEW!!! PIK in JavaScript Update!!! butteraugli.js Libwebpjs (lossless) Example WebM JavaScript Decoder Example --> Source Code Ogg Vorbis JavaScript Decoder Example --> Source Code
営業日・定休日カレンダー
設置がやや大変ですが毎月○日とか毎週○曜日とかそういう指定と複数設置が簡単になったバージョンのカレンダーです。基本的な流れはステキカレンダーと同じですが、細部が調整されており、カスタマイズはしやすくなっていますが、設置作業にはちょっぴり知識が必要になったかもしれません。 営業日・定休日カレンダーの概要なるべく柔軟に更新せずにい営業日や定休日、イベントや商品発送予定日などの告知をわかりやすくカレンダー形式とリスト表示で告知するためのスクリプトです。 class指定の他に説明文やURLを指定することもできます。設置方法は2.x系と少し変わりましたがDOMを使って半永久的にめくることができる点などは変わっていません。 営業日・定休日カレンダーの機能 日曜日以外の曜日から開始できる カレンダーは基本的に一番左が日曜日ですが、一番左を月曜日にすることなどができます。 パラメータを付けてクリック 年・
右クリック禁止を回避する
ブラウザの右クリックには、文字コードの変更やナビゲーションのための進む、戻るなどがあるわけですが、右クリックを禁止するという嫌がらせをしている困ったWebサイトがあります。右ボタンを押しながらのマウス操作で動作を指示できるマウスジェスチャ機能を利用するたびに警告が表示されるとかなりウザいと感じるわけですね。 まあ、右クリック禁止はJavaScriptの機能で実現しているわけなので、ブラウザの設定をScriptを実行しないようにしておけば何ごともなく右クリックできるわけで、右クリック禁止ははっきりいって無意味な行為で無駄な努力です。そうはいっても、ブラウザの設定を変えてScriptを無効にするのは現実的ではありません。ナビゲーション関連はブラウザ上部のメニューバーから使ったりキーボード操作でよいとして、おそらく画像の保存やソースを見てみようというときに障害となる程度でしょう。 Firefox
jQueryでサイト内に簡単にRSSフィードを組み込めるプラグイン「zRSSFeed」｜BLACKFLAG
サイト内にRSSフィードを読み込む方法はたくさんありますが、 jQueryを使って簡単に組み込めるプラグインがないか探したところ、 必要最低限の要素で組み込むことが可能となる理想のプラグイン 「zRSSFeed」に辿りついたのでここでも紹介してみます。 zRSSFeed – RSS Feeds Reader for jQuery zRSSFeed – RSS Feeds Reader for jQuery 上記ページからダウンロードできるプラグインファイルと併せて 実行させる為のIDをつけた＜div＞などを用意し、 スクリプトを実行するだけ。 実装方法のサンプルについて。 HTMLは下記の様に任意のID名がついたブロック要素を配置します。 ※今回のサンプルではID名を「feed」にします。 ◆HTML <div id="feed"></div> そして下記の様にID「feed」に対して、ス
Pinterest風のデザイン 「jQuery Masonry」を試してみた
Pinterestのデザインは、要素が敷き詰められた感じになっています。 これはなんていうデザインの通称かわからないので、ひとまず「Pinterest風」と言ってます。 これを実装してくれるJavaScriptプラグインのひとつが「jQuery Masonry」なのですが、どういうものか使って試してみました。 基本的には公式サイトに載ってることを自分なりにまとめた内容となっております。 ダウンロードはこちらから JSなどの必要なファイルは以下からダウンロードします。 jQuery Masonry 設置の仕方 設置も特に難しいことはなくJavaScript読み込んでCSSで調整する感じです。 サンプルは以下から サンプルサイト JavaScriptの記述例 <script type="text/javascript" src="https://ajax.googleapis.com/ajax
jQueryAutoHeight.js - 複数のカラムの高さを最大値にそろえるjQueryプラグイン | かたつむりくんのWWW
Movable Type, Craft CMS, Drupal, HTML, CSS, JavaScript, jQuery etc. jQueryAutoHeight.js とは jQueryAutoHeight.js とは、複数のボックスの高さを自動的にそろえるシンプルな jQueryプラグインです。高さのそろえ方は、次の２通りです。 セレクタで指定したすべての要素を、その中の最大値にそろえる セレクタで指定した要素を、オプションで渡した数ごとに、その中の最大値にそろえる（1行ごとにそろえられる） サンプル 複数のボックスの高さを最大値にそろえるjQueryプラグイン ダウンロード Releases · tinybeans/jQueryAutoHeight ※jQuery 1.9 以降で利用する場合は v0.04 以降をお使いください。 使い方 ファイルの読み込み ダウンロードしたファ
Lightbox
Getting started Download a zip of the latest release (or any previous one) from the Github Releases page. Or install using npm: npm install lightbox2 --save Open up the zip file and take a peek at the barebones, working example that is included in the /examples folder. Ready to set Lightbox up on your page? Start by including the Lightbox CSS and Javascript. You can grab both these files from the
[JS]アナタのソーシャルコンテンツをまとめてPinterest風レイアウトで表示するスクリプト -Socialist
ブログのRSSをはじめ、Facebook, Twitter, Tumbler, Google+, Pinterest, Flickr, YouTubeなどのコンテンツを全てPinterest風のグリッドレイアウトで表示するjQueryのプラグインを紹介します。 幅800pxで表示 Socialistの使い方 Step 1: 外部ファイル head内に当スタイルシートと「jquery.js」と当スクリプトを記述します。 ※ダウンロードできるデモファイルにはjQueryの記述が無いのでご注意を。 <link href="../jquery.socialist.css" rel="stylesheet" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <scri
クリックするとフォーム内の字が消えるJavascript * Devotion Time
検索やメールアドレス記入のための入力フォームに、あらかじめ「検索キーワードの挿入」といった薄い文字が記されていて、クリックすると消える。しかもフォームの外をクリックすると字が復活する、そういう入力フォームをhtmlとjavascriptで簡単に実装しましょう。 フォーム内のvalueの値はjavascriptと関係なく自由に変えることができます。 <form> <input type="text" value="ご記入下さい" onFocus="cText(this)" onBlur="sText(this)" style="color:#999"> </form> <script type="text/javascript"><!-- function cText(obj){ if(obj.value==obj.defaultValue){ obj.value=""; obj.style
portal-f.pw - このウェブサイトは販売用です！ - portal f リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
画面サイズに応じて画像を差し替える軽量jQueryプラグイン・jQuery Picture - かちびと.net
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 スマフォやタブレットなどで閲覧した 際に表示する画像を差し替える軽量な jQueryのプラグイン・jQuery Picture のご紹介。レスポンシブWebデザイン でよく問題視される画像のサイズの件 に対応するライブラリです。 設定したブレークポイントに応じて画像を切り替えるライブラリです。2KBと軽量なのが良いですね。 以下サンプルです。手抜きですみません。 jsfiddleでフレームを操作して動作確認出来ます。 Sample コード <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <scr
EXCELをHTMLのTABLEに変換するjQueryプラグイン | ユージック
EXCELをHTMLのTABLEに変換するjQueryプラグイン 更新日：2008年12月26日｜公開日：2008年12月26日 All Aboutで連載もしているJavaScriptで有名な高橋登史朗氏が作ったEXCELをHTMLのテーブルに変換するjQueryプラグインjquery.csv2table.jsが便利そうなのでご紹介しようと思います。 想定される使用例 テーブルを使用する更新頻度の高い以下のケースに特に有効だと思う。 料金表 対応表(価格や品番など) スペック表(材質や機能など) CMSなどではテーブルをシステム化するのが難しい CMSなどでサイト構築しているとほとんどのページが動的なモジュールで更新可能なのに対してテーブルというのはプログラムによってなかなかシステム化できないというケースが多いと思います。 クライアントはEXCELを利用してデータをまとめているケースが多い
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
Selectivizr - CSS3 pseudo-class and attribute selectors for IE 6-8
Enhancing IE's selector engine Selectivizr adds support for 19 CSS3 pseudo-classes, 2 pseudo-elements and every attribute selector to older versions of IE. It can also fix a few of the browsers native selector implementations. JavaScript-knowledge: none Selectivizr works automatically so you don't need any JavaScript knowledge to use it — you won't even have to modify your style sheets. Just start
JSNote - IEをCSS3に対応させるCSS3 PIEのJavaScript版を使う
JSNote 読んですぐに使えるJavaScript・HTML・CSSのタイプを書いています。 HomeLatest Entries左、中、右クリックのカスタムイベントを追加するjQueryプラグイン配列の任意の位置に値を代入したり削除したりするJavaScriptだけでローカルの画像をBase64エンコードするIEをCSS3に対応させるCSS3 PIEのJavaScript版を使うリストをページ分けしてページャーを付けるjQueryプラグインArchives2012-012011-122011-112011-02すべての記事一覧CategoriesJavaScriptjQueryブログその他CSSRSS IEをCSS3に対応させるのにCSS3 PIE使いたいけど、htcファイルってFC2ブログにアップロードできないし、htcって何か気持ち悪いのであんまり使いたくないって人のためのタイプで
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Mr.Ri／DTP宝箱