WordPressテーマ開発：jQueryの正しい読み込み方法 | WWWクリエイターズ
WordPressのテーマ開発者の、初期に起こりやすい疑問や迷いを解決するシリーズです。今日は、テーマ開発に必須の知識ともいえる「jQueryなどの読み込み方法と、正しい使い方」です。 WordPress での jQuery の読み込み方法 まずはじめに、header.phpの<HEAD>タグ内に、直接jQuery読み込み用の<script>タグを書き込んんではいけません。WordPressには、WordPressの作法があります。 wp_enqueue_script() 関数を使おう WordPressでは、独自のJavascriptファイルを読み込む際に利用する関数があります。「wp_enqueue_script()」です。もし読み込もうとしているJavascriptファイル（/js/main.js）において、jQueryを参照する必要がある場合、下記のように記述します。これにより、W
jQueryをWordPressで使う場合の読み込み方と使い方
WordPressでjQueryを使おうと思った時、動かなくて困る事がよくあります。 jQueryのプラグインなどを入れてみてサンプル通りのコードを貼り付けたのに動かない！なんでよ！って思うんですんが、jQueryの通常の書き方だと、大抵は動きません。 テーマによっては動いたりする時もあるのが、さらに混乱する原因にもなってます。 jQueryをWordPressで使いたいのに動かない場合、ちょっと書き方を変える必要があります。 WordPressは標準でjQueryを読み込んでるので読み込みは不要 WordPressに初めから入ってる初期のテーマ(Twenty Fifteen など)や公式テーマ、購入したテーマなど配布されてるテーマを使ってる場合、WordPress本体が持ってる標準のjQueryを読み込んでる事が多いです。 「Twenty Fifteen」を適用した場合のソース画面(jQ
Resizable | jQuery UI 1.10 日本語リファレンス | js STUDIO
jQuery UI Resizableプラグインは選択している要素をリサイズ可能な要素にします。 最大最小の幅や高さなど、様々な指定を行うことが出来ます。 (リサイズのドラッグをするためのつまみを持つようになります) このウィジットはいくつかの機能的なCSSを必要とします。 このCSSが読み込めないと機能しないため、最初に必要とするCSSを読み込むようにしてください。 型：Selector or jQuery or Element 初期値：false リサイズしている要素と同期して同じようにリサイズさせたい要素を指定します。 $( ".selector" ).resizable({ alsoResize: "#mirror" }); // getter var alsoResize = $( ".selector" ).resizable( "option", "alsoResize" )
jQuery:親ウィンドウに子ウィンドウのデータを反映するときの注意 – BmathLog
そもそも jQuery で親ウィンドウの要素に値を埋める時 window.opener.$(要素).val(値) とすればよいのだが、サンプルをつくったら window.opener.$ is not function というエラーがでて反映どころではない状況に陥った。 注意点 いままで XoopsCube とか ZendFramework で画面を構成しているもので作業しているときは自動的にどの画面にも jQuery を読み込ませていた。 サンプルでは子ウィンドウ側では jQuery を読み込んでいたが、親ウィンドウでは読み込んでいなかった。 親ウィンドウも読み込んでいないと先のエラーが出る、ということがわかった。そりゃそうだろう、とわかってしまえばそうなのだが、気づかないとハマる。手っ取り早くサンプルを作ったつもりが思わぬ落とし穴に気づかず時間を浪費した。 親ウィンドウのデータ参照だけ
jQuery.each() | jQuery API Documentation
Description: A generic iterator function, which can be used to seamlessly iterate over both objects and arrays. Arrays and array-like objects with a length property (such as a function's arguments object) are iterated by numeric index, from 0 to length-1. Other objects are iterated via their named properties. version added: 1.0jQuery.each( array, callback )
jQuery CDN
jQuery Core Showing the latest stable release in each major branch. See all versions of jQuery Core. jQuery 3.x jQuery Core 3.7.1: uncompressed, minified, slim, slim minified jQuery 2.x jQuery Core 2.2.4: uncompressed, minified jQuery 1.x jQuery Core 1.12.4: uncompressed, minified jQuery Migrate jQuery Migrate 3.5.2: uncompressed, minified jQuery UI Showing the latest stable release for the curren
ほぼCSSだけで、LPでよくある上下左右からフェードインするやつを実装する - Qiita
背景 LP実装のフロントエンドを担当 Ruby on RailsのView内にてフロントエンド組み込み前提 デザインカンプにアニーメーション、インタラクションの仕様は無かったが、昨今全く動かないLPの方が少ないのではと思った デザイナーにインタラクション考えてもらうのも確認フロー大変だし、Railsにプラグイン組み込む検証リスクなど諸々あり、1回あきらめた 諦めてからが試合開始 変更に強いCSSアニメーション主軸にスクロールインタラクション作れればと思った ゴニョゴニョしたら意外と出来た 実装内容 CSSアニメーション実装 .anm_modデフォルト = 下から元来の位置に戻りつつフェードイン。速度ノーマル &.left, &.right 左右から元来の位置に戻りつつフェードイン &.delay, &.fast フェードイン速度遅め、早め 上記２点の設定で、フェードイン方向（３方向）とスピ
jQueryでCSSプロパティの値を取得する方法｜BLACKFLAG
jQueryでCSSのプロパティの値を操作する方法は基礎的なことで簡単なのですが すでに各要素に指定（設定）されているCSSプロパティ値を取得する方法が 必要な際に使い方を忘れがちなのでメモ書き。 例えば＜div id=”box”＞とID名が付けられた ボックス要素の幅「width」を取得する場合。 $(function(){ $('#box').css('width'); }); 単純な記述ですが、「.css」の後ろに属性を記載するのみです。 このままでの記述では何も意味を持たないので この＜div id=”box”＞にCSSで幅「width」と高さ「height」を指定して 変数「boxWidth」「boxHeight」にそれぞれ値を入れた後、 アラートで値を表示する場合。 ◆HTML <div id="box"></div><!--/#box--> ◆CSS #box { width
phiary
Code html 目次となるアンカーと, ページトップに移動するアンカーを設置しています. <body> <h1 id='top'>jQuery でページ内リンクを全てスムーズスクロールにしよう</h1> <h2>Table of contents</h2> <ul> <li><a href='#section1'>Section 1</a></li> <li><a href='#section2'>Section 2</a></li> <li><a href='#section3'>Section 3</a></li> <li><a href='#section4'>Section 4</a></li> </ul> <h2 id='section1'>Section 1</h2> <p class='pad'>Text Text Text Text</p> <a href='#top'
jQueryプラグイン「jquery.cookie.js」でcookieを簡単に扱う ｜ Tips Note by TAM
JavaScriptでcookieを扱うのは、値のエンコード・デコードや書き込む際の文字列結合、値を取り出す実装など、意外に面倒です。しかし、「jquery.cookie.js」を利用すれば、cookieを簡単に扱えるようになり、シンプルなコードで実装できます。 まずはjQueryとjquery.cookie.jsを読み込みます。 ※jquery.cookie.js は GitHub（https://github.com/carhartl/jquery-cookie）からダウンロードすることができます。 <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.cookie.js"></script> ■cookieの設定 cookieを保存するには
scrollnav.js
A small, dependency free JavaScript plugin for auto generating and tracking single page navigation (aka a Table of Contents) Get started View the demos Features Simple setup Pass your page’s content to scrollnav and it will generate the navigation and track scrolling automatically. Fully customizable All the styling is up to you, make scrollnav look and behave however works best for your project.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【jQuery】ラジオボタンの状態取得と選択制御 - Qiita
JavaScript Array.forEachとjQuery.eachの違い - Qiita
シンプルなグリッドベースのギャラリー実装jQuery「sampGallery」:phpspot開発日誌
タイプライターアニメーションエフェクト実装「jQuery.Hypertext.Typewriter」:phpspot開発日誌
テキストを部分的にアニメーションしながら交換できる「jQuery Text Rotator」:phpspot開発日誌
モダンなデザインでウィザードを作れる「wizzy」:phpspot開発日誌
.toArray() | jQuery API Documentation
リストから必要な物を選ぶUIを実現する「jQuery.SelectListActions」:phpspot開発日誌
巨大データでも高速に動作する「jquery.dgtable」:phpspot開発日誌