mania-ku

何か作りたいプログラマ未満。

【ブラウザ】jsを一時的に無効にする

検証で一時jsを無効にしたいときがあるので、その方法をメモ。

Firefox

検索窓にabout:configと入力してEnter。
検索にjavascript.enabledを入力して、
javascript.enabledを右クリックして、切り替えを押す。

※値がfalseならjsが無効、trueなら有効

参考サイト:Mozilla Re-Mix: Firefox 23でJavaScriptを無効にする方法。

Safari

開発>JavaScriptを無効を選択

Chrome

Chrome>環境設定(検索窓にchrome://settings)>プライバシー>コンテンツの設定>すべてのサイトに対して Javascript の実行を許可しないにチェック

【Advent calendar】sublimeText2でJSHINTを入れる方法

これはadvent calendar13日目の記事です。
12日目の昨日はWindowsXPのサポートが終了するけど、そのあと使い続けるってどういうこと?でした。

jQueryプラグインの構文チェックをしてみたくて、Mac10.6.8でインストールしてみました。
必要なものは

  • ターミナル
  • sublimeText2

です。

ターミナル

(nodeとHomebrewがあったらとばす)Homebrewのインストール

ruby <(curl -fsSkL raw.github.com/mxcl/homebrew/go)

(node入ってたらとばす)nodeをインストール

brew install node

JSHintをインストール

sudo npm install -g jshint

sublimeText2

(sublimeText2入ってたらとばす)sumlimeText2をインストール

Sublime Text: The text editor you'll fall in love with

(Package Control入っていたらとばす)Package Controlを入れる

View > Show Console

Ctrl + `

import urllib2,os; pf='Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler( ))); open( os.path.join( ipp, pf), 'wb' ).write( urllib2.urlopen( 'http://sublime.wbond.net/' +pf.replace( ' ','%20' )).read()); print( 'Please restart Sublime Text to finish installation') 

JSHINTを入れる

Cmd+Shift+p>install>JSHINT

適当なJSを開いて、動くか確認

ファイルの上で右クリック>JSHINT
もしくは
Ctrl+J

リアルタイムにエラーチェックするためにSublimeLinterをインストール

Cmd+Shift+p>install>SublimeLinter

エラーチェックの設定

よくわからないので、ひとまずバシャログの設定をコピペしました。
これで、jQueryのエラー出なくなるみたいです。
Preferences>Package Settings>SublimeLinter>Settings – User

でもこれだとJSHINTと違う箇所にもエラーが出てしまいます・・・
謎です

【js】jsdaresをやってみた

英語は絶望的なので、基本エキサイト翻訳して読みました。
読まなくてもわかりそうなところは適当にやったけど。
これはJSの勉強になるかと言われたら、ならないかもしれない。
でも、プログラムを勉強する第一歩としてはいいかも。
こういうのをやると、やっぱプログラム楽しいなぁと思う。
JSはブラウザ間の差異とかあると胃がちぎれそうなくらい痛くなるんで、実務ではjQuery使ってしまいますが。
やっぱり英語勉強しないとなぁ・・・
CSSやJSでわからない部分をググってやんわり読解できるくらいの能力しかないので。

jsdares

【静的サイト】JSでHTMLを挿入!

DWのライブラリでは、ページごとに書き換えなくては行けないしめんどう・・・
そんなときに使えるのがJSです。
※たぶんPHPよりは敷居が低いよね・・・?

今回はjQueryを使っていなくてもいいように「document.write」を使いましょう。
HTMLの挿入したい場所に下記を書き込みます。

<script language="JavaScript" type="text/javascript" src="パス" charset="Shift_JIS"></script>

ここではかならず、JSの文字コードをcharsetに入れてください。
※文字化け対策
JSの中身はこんなかんじ。

document.write( '<p><a href="#"><img src="パス" alrt="これはバナー!"></a></p>' );

複数行使いたいときは、 ‘HTML’, ‘HTML’ このように書いてください。

【js】encodeURIでの改行

改行したいところに「\r\n」を入れる

encodeURI("1行目\r\n2行目")

【js】IE7のバグ?動的要素を表示・非表示にする際に要素が重なる

IE7で、JavaScriptを使って動的に要素を表示・非表示して、要素が重なるという対処法がよくわからない状況に遭遇したので、解決法をシェアします。

どうやら、こちらで言っているものと同じ現象な模様。

  • 外側(親)の要素に背景があり、hasLayout=false
  • 内側(子)の要素がposition:relative&hasLayout=true
  • 内側の要素の高さが変化する(表示非表示やアコーディオンの開閉などで)

のときになるようです。

hasLayoutとは?はこちらをどうぞ。

【ドットインストール】JavaScriptのTips集をやり終えた

JavaScriptのTips集の忘れてた2回分をやっとこさやり終えた。

JavaScriptは三項演算子とMVCの基礎がわからなくてつまづいているところ。
ここさえ分かれば、今以上にJavaScriptが面白くなっていくと思うのになぁ。
覚えは悪いけど、ちょこっとずつ理解していきたい。

[js]エクセルの表をtableに変換ツール

コーディングで表を作るときにもっと簡単にできないかなーと思って、
ツールを作ってみました。

[js]カナ→半角カナ変換ツール

携帯サイトをコーディングするときにカナを半角カナにすることが多いので、
ツールにしてみました。

[js]紙芝居っぽいパララックス

紙芝居っぽいパララックスのサイトを見たので、試しに作ってみました。