jQuery(173)

173follower
goto_jp さんのアバター 673views

jQuery:二重配列ループ

jQueryだとeachループが簡単にできるのでメモ。(JavaScript自体はeachの概念がない) 下記例は「array1」に["りんご","ごりら","らっぱ","ぱんだ"]の項目をまず挙げ、実際のデータ配列の「array2」の中... 2014年12月15日
goto_jp さんのアバター 1,092views

jQuery:配列の重複値を弾く

var array = ['東京都','千葉県','埼玉県','千葉県','千葉県','東京都']; このような重複するデータを持つ配列の重複を弾きたい場合は下記のようにfilterを利用する。 array = array.filte... 2014年12月12日
goto_jp さんのアバター 119views

jQuery:ページ内のクラスを指定して特定の属性値を抜き出す

<li class="className" zokusei="100"> <li class="className" zokusei="200"> <li class="className" zokusei="... 2014年12月12日
harada さんのアバター 718views

jQueryプラグインでソースコードを装飾&コピペしやすくする

投稿は簡単に、でもソースコードは見やすく、そして利用しやすくするためにソースコードの見せ方を変更しました。 GitHub Flavored Markdown for WordPressで、Google Code Prettifyを利用するの... 2014年12月10日
harada さんのアバター 277views

easy pie chartでつくる簡単な円グラフ

easy pie chartというjQueryプラグインを利用することで簡単に円グラフが作成できます。 サンプル・ダウンロードはこちら 読み込む jQueryを利用していますので、jQueryファイルとダウンロードしたプラグインを読み込... 2014年12月5日
harada さんのアバター 2,861views

jQuery:要素をランダムに表示する

jQueryを利用することで簡単なコードですぐにランダム表示ができるようです。 利用方法 jQueryを利用していますので、もちろんあらかじめjQueryを読み込んでおきます。 <script type="text/javasc... 2014年11月26日
harada さんのアバター 565views

jQueryで「WordPress Popular Posts」にナンバリングして順位を付ける

「WordPress Popular Posts」はデフォルトでは順位を出力する変数を持っていません。 CSSで実現する方法が色々でてきたのですが、今回はそうではなくjQueryを利用してナンバリングしたいと思います。 設定方法 jQu... 2014年11月20日
harada さんのアバター 2,314views

Bootstrapでサイドブロック固定を行う場合は「Affix」ではなくjQueryプラグインを利用した方がいい

Bootstrapでは簡単にメニューブロックなどの固定を行うことができるJavascript「Affix」がついてます。 なのでエレベーター式の右ブロック固定をするときにこちらを利用しようと思ったんですが、色々と問題が発生してしまいました。... 2014年11月12日
harada さんのアバター 2,181views

Boostrapのセレクトボックスをかっこよくする

bootstrap-selectというライブラリを追加することで、セレクトボックスをデフォルトからBootstrapのボタンやドロップダウンを利用したスタイルに変更することができます。 利用方法 jQueryを利用しているのでjQuer... 2014年11月5日
harada さんのアバター 1,223views

jQueryでスクロールで右下にひょこっと現れるボックス

表示サンプルはこちら。 jQueryを利用しているので、読み込んでください。 <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.... 2014年10月23日
harada さんのアバター 5,987views

フォームにテキストを入力してリアルタイムに表示を絞り込む

オープンソースAMIのように、フォームにテキストを入力してリアルタイムに表示を絞り込む方法です。 サンプルはこちら。 事前準備 jQueryを読み込んでおきます。 <script type="text/javascript" s... 2014年10月3日
nbeppu さんのアバター 504views

Java の Comet でサーバープッシュを行う(2)

Java の Comet でサーバープッシュを行う(1)のつづき。 次に、プッシュの方法については、Java 側では以下のように MessageSender にメッセージを受け渡します。 ServletContext ser... 2014年10月2日
@iwasaki さんのアバター 731views

jQuery JSONViewを使ってJSONを見やすくする

JSONを画面上にそのまま表示しても、見づらいですよね。 http://tokyometroapp.herokuapp.com/api/TrainInformation そこでこのJSONを取ってきて多少見栄えを良くしてみます。 今回... 2014年9月19日
goto_jp さんのアバター 6,198views

「bxSlider」で画像が一度に出てしまう際の対処

前回レスポンシブ対応のスライダーを生成する「bxSlider」を紹介しましたが、スマホなど回線や描画が遅い環境で開くと、JavaScriptでスライダー化される前にリストの画像が一気にボボンと出てしまい見た目に悪かったので、CSSレベルで対... 2014年9月19日
goto_jp さんのアバター 1,712views

レスポンシブ&スワイプ操作に対応したスライダーjQueryプラグイン「bxSlider」

PCでは無限スライダー表示、スマホではスワイプ操作に対応したスライダーになってくれる「bxSlider」は、非常に簡単にサイトへ加えられます。 ファイルの読み込み <script src="//ajax.googleapis.... 2014年9月19日
goto_jp さんのアバター 1,667views

jQuery:アコーディオンメニュー改訂版

See the Pen jquery accordion menu by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. jQueryでアコーディオンメニューを作る 以前作った上記アコーディオ... 2014年9月5日
harada さんのアバター 201views

jQueryを利用して特定のIDで括られた要素を非表示にする

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script> <script type="text/javascript"> ... 2014年8月11日
Yukimi Sato さんのアバター 740views

jQueryを使わずにタブ切り替えをjsで実装のタブCSS

jQueryを使わずにタブ切り替えをjsで実装する のタブ部分のcss指定になります。 selected付与時はタブがハイライトになるようにしてあります。 #tab{ padding: 0 10px; border-b... 2014年7月28日
Yukimi Sato さんのアバター 351views

検索ボックスにフォーカスしたら括っているDIVの枠線の色を変える

<div class="search"> <form> <input type="text" class="searchText" value=&qu... 2014年6月25日
goto_jp さんのアバター 14,079views

jQuery:スクロールするレイヤー内で指定位置までスクロールさせる

サンプルはこちら。 See the Pen nBidH by Kazuyoshi Goto (@KazuyoshiGoto) on CodePen. ページを開いた時点で「Caption 4」を表示するようにしており、上にあるリンク... 2014年6月18日