[Webpack][React]既存サイトにさっくりReactを導入するためのWebpack設定
WordPressとかで構築されててViewに必要なデータは揃ってるしAPI作るのが面倒な場合。
HOME > WEBプログラム覚書 > JavaScript
WordPressとかで構築されててViewに必要なデータは揃ってるしAPI作るのが面倒な場合。
jQueryの.slideDown()のこの動き。
タブのサンプルやプラグインは多々あるのですが、文書構造が変だったり、デザインとか 余計なことをしてくるのが多く使いにくかったので、適当に書いて使っていたものを jQueryのプラグインにしてみました。
入門記事の多くで、基本的に $(function(){}); にコード書けと言われますが、 window.onloadを使ったほうが良いケースも結構あります。
Divの高さを合わせるスクリプト(safari対応版)にコメントをいただいたので、 関数内でのid指定ではなく呼び出し時に指定する方法に変更しました。
セキュリティ的に禁止してるんだろうけどChromeでは出来ないのか、そもそもJavascriptの仕様として禁止されてるのかは不明。
WebフォントとjQueryのテキストエフェクトプラグインを試してて気がついたんだけど API経由でWebフォント取得、設定してるとJavascriptの実行が早すぎて困るw
長いソースコードをブログとかに張り付けると出てくるスクロールバーって いまいち操作しずらいし、見た目も良くないですよね。
そんな不満を抱えて悶々としてる人はjquery.stretchable.jsを使ってみてはどうでしょう。
今から16年前Netscapeブラウザのソースコードの公開方法の会議の中で、初めてオープンソースという言葉が使われた今日、 みなさんいかがお過ごしでしょうか。
今回の投稿はそれとは関係のないjQueryのparents()とclosest()が 似てたので何が違うのか試した時のメモです。
jQuery Mobileは読み込まれてから
mobileinit -> pagebeforecreate -> pagecreate -> pageinit
の順番でイベントが発生する。
jQuery Mobileにおけるダイアログの扱いはウインドウではなくページ。 なので通常のページと同様に扱える。ダイアログウインドウを出す。じゃなくダイアログページに遷移する。的な。
いまさらながら、jQueryに公式なテンプレートプラグインあるの気がつきました。 もう一年以上前に出ていたんですね。まだベータだけどw
jQueryの概念というか役割というか、おおざっぱなイメージについて。jQueryの書き方とかの話じゃありません。
jQuery APIリファレンスをみて、 jQuery.each()とjQuery(selector).each()のような同じ名前のメソッドで何が違うんだ?どう使い分けるんだ? と迷わないためのお話です。
jQueryの.add()。いまさらながら、なんでこれが違う結果になるのか戸惑う。
なんか楽でいい方法ないかなと久しぶりにライブラリ利用せず書いてみました。
jQuery UIメモ 1の続き。 前回同様とくに内容はありません。
jQueryが1.4になってました。とにかくパフォーマンスが劇的に向上してるみたいです。 今後は1.4を利用してみようかとおもいます。
アニメーションががSexyとかじゃなく写真がちょいエロなだけなので 選ぶ写真によっては爽やかにもなりますw
ツールチップについて色々と検討。
最近思うのですが、マウス載せると何か出るよと気づかせる表現はあるべきですが、 載せたあとのアニメーションとか不要じゃないですか?
情報見たいからマウス載せてるわけで、すぐ見たいわけです。 アニメーションはいいから0.1秒でも早く表示してくれって思うのは僕だけでしょうか??
そろそろAjaxって奴を・・・調べてみよう。
jQueryのプラグイン作成がなんとなくわかった気になってたけど 全然わかってなかった。ってかjQuery自体わかってなかった。 更に言うとjavascriptが今だにわかってないんじゃねって感じで凹むなー。
ちょうどこういうのやりたかったので どんな感じで実装されてるか調べてみた。
jQueryのfadeOut()、fadeIn()をpngbehavior.htcが適用されてるページで 利用するとfadeが効かない模様(ie6)。ここのサンプルでは、全然動きませんが フェード効果が効かないってだけの場合もあった。
javascriptというかDOMのNodeインターフェイスに定義されてる プロパティを覗いてみる。
勉強のため優れたナビゲーションを再現してみる。もちろん完全再現ではない。 とりあえず今回はNavigation Menus: Trends and Examples | Design Showcase | Smashing Magazine で紹介されていたPlayground Blues。美しいですね。
だいぶ昔に紹介されてた記事ですが下記ページを適当に。 コード見ながら大体こんな感じ言ってるだろくらいの感じなので 間違ってる可能性もあり。
javascriptでIEを判定するコードが [JS]わずか「12文字」でIEを判別するスクリプト | コリス で紹介されてました。
jQuery1.3もリリースされたしってことで 今さらながらjQueryの勉強してるわけですが $()で取得できるjQueryオブジェクトが気になりました。
なんでかってーと「 jQuery.eq(n) 」の機能をうまく文章にできなかったからです。 どーでもいい理由ですが調べてみたらいい勉強になりました。
タブパネルを自力で実装することになった場合、 ひとつの要素がtrue(表示)の時、 その他の要素をfalse(非表示)にさせる仕組みって どうすればいいんだろうと思って試し書き。
「javascript エラーコード」でエラーになるコードの解消方法。 うぇっ。もう一年以上経ってるのか・・・
ページ内リンクを手動で作成するのは結構手間なんで jQueryを利用して自動で作成。
今さらながらjQueryをお勉強。日本語のリファレンスも充分すぎるくらい充実してますんで、勉強しやすいですねよく使いそうなDivの表示、非表示切り替えをjQueryでやると・・・
「innerText」はFirefoxで利用できないようなので、try~catchで分岐させようと思ったけどダメだった。
IDEA*IDEAさんが作ってくれた「新しくプログラミング言語を覚えたいときに行うべき10の練習問題」3問目をjavascriptの勉強にやってみた。
IDEA*IDEAさんが作ってくれた「新しくプログラミング言語を覚えたいときに行うべき10の練習問題」2問目をjavascriptの勉強にやってみた。
IDEA*IDEAさんが作ってくれた「新しくプログラミング言語を覚えたいときに行うべき10の練習問題」をjavascriptの勉強にやってみた。
javascriptで子要素を取得する方法についてのメモ
HTMLオブジェクト?ではgetElementsByTagNameメソッドが利用できる。「id」が「getJS」の「ul」以下の要素に含まれるHTMLを表示。
javascriptでよくアクセスするフォーム関連の要素のベーシックな取得方法。
なんだかできそうでできないjavascriptのコード。
javascriptでエラーが発生した場合の処理はtry-catch構文を利用する。デバック利用にいいのかな。
Javascript で HTMLエスケープを行うPHP関数、htmlspecialchars を実装で紹介されているjavascriptを試してみた。
先日のエントリーDivの高さを合わせるスクリプトではsafariで動作しなかったが何とか解決。
アコーディオンパネルやタブパネルが簡単に実装できるSimple Javascript Accordions。
tableでは簡単な高さあわせだが、CSSレイアウトの場合なかなか難しく背景などが途中で切れてしまうことが多々ある。
イベント属性にjavascriptを仕込む際はページがjavascriptであることをmetaで宣言しないといけない。
JavaScriptで正規表現による検索を行うには、RegExpオブジェクトとmatchメソッドを利用する。
関数に引数を渡す場合は多々あるが、引き渡す値の数が不特定の場合javascriptではargumentsで引数を取り出すことができる。
昨日のエントリーで書いてあるのはテーブルが複数あった場合、ページ内のtrを一まとめで取得するのでちょっと困ることがある。なんでテーブルが複数あってもテーブルごとにtrを取得するように変更。
HTMLにclass振って対応している場合、行の削除、挿入が頻繁にあると対応がとても面倒なのでJavaScriptを活用するとよい。
IDではなくタグの名前でオブジェクトを取得したい場合、getElementsByTagNameを利用する。
JavaScriptの配列の基本についてあれこれメモ。
ウィンドウのサイズを取得するには.innerWidthと.innerHeightを利用する。問題はIEが対応していないことだ。
JavaScriptを使って表示内容を切り替えるサンプル。getElementById()を使って指定IDのオブジェクトにアクセス。
HTMLのタグと内容を取得するにはinnerHTMLを利用する。
フォームに入力された値が数字ではない場合、アラートを表示する。
ブラウザの情報を取得するにはnavigatorオブジェクトを使う
htmlにファイルにJavaScriptを記述する方法