外部JSを読み込むときにどうしてもdocument.writeで読み込まなければならないけどうまくいかないとき

まず、タイトルが長い。
タイトル通りだが、サイトの作りによってはクライアントの要望によってPCに偏ったアニメーションごりごりのサイトを作る場合がある。

サイト全体としてResponsiveで作る前提なのでviewportでJSを分けるのも負荷が高いので、CSSとJSをUserAgentで分けてしまおうと。

その時点でResponsiveじゃないというのは言わないでおきます。

普通に考えて、以下のように設定するかと思われる。
<script>
document.write(‘<link href=”○○○.css” rel=”***” type=”***” /> ‘);
document.write(‘<script src=”○○○.css” ></script> ‘);
</script>

でもこれだとCSSの方は上手くいくけど、JSの方だけなぜか’);が無視されて変なところまでwriteしにいく。

ブラウザのバグらしく、解決策は簡単。

document.write(‘<script src=”○○○.css” ></scri’ + ‘pt> ‘);

と分けちゃえば大丈夫みたい。

若干ハマりました。
以下、参考にさせていただいたサイト。ありがとうございました!

http://vip-audio.jugem.jp/?eid=87

 

2,041 views

gmailのファビコンがタカトシのライオンのようになっている件

一年前くらいからかな、この症状が出て最初は焦ったのですが、その辺はめんどくさがりなので忘れておりました。

が、久しぶりに思い出してググってみたところビンゴな投稿が。
http://www.vectorview.net/vjv_style/cloud/736/
助かります!

が、そのサイト上だとすぐ解消となっておりますが私はずっとだな。
まぁ、大丈夫だろうけど。

 

788 views 859 views

とあるwebサイトのページ数を知りたいときに手っ取り早く知る方法

website explorerなどを使用すればガッツりいけるけども、とりあえずふわっと知りたいなって時は以下の検索をすればhtmlの数が分かるらしい。小規模サイトでやってみたら合ってた。大規模だとどうなんだろうね。

「site:(調べたいページのURL) filetype:html」

参考にさせていただいたサイト
http://sddmem.jp/%E3%82%AA%E3%83%AA%E3%82%B8%E3%83%8A%E3%83%AB%E8%A8%98%E4%BA%8B/244.html

1,118 views

Sassをmac dreamweaverで使えるようにしたい

一個前の記事につながるが、今度はmacでsassの環境を作ろうとしてつまづいた。

・MMDocumentTypes.xml
・Extensions.txt

をファインダーで探してscssを追加〜、さてドリ起動。
あれ、scssファイルを認識していない。

finderで見つけた上記2ファイルは何度見ても更新ずみ。
グーグル先生に質問をして回答してくれたサイトがこれ。

http://k0u1.com/blog/archives/662

場合によって隠しファイルになっている場合があるらしいです。

1,132 views

SassでCompassのWindows -31Jエラーが出たときの対応(Ruby 2.0向けかも)

数時間悩んでシステムの友達とSkypeしながらようやくCompassがエラーを吐かなくなりました。

Sassでfont familyなどに日本語が入っているとWindowdでは
---------------------------
Encoding::UndefinedConversionError on line [“654”] of C: “\xEF\xBC” from Windows
-31J to UTF-8
---------------------------
的なエラーが出るようです。

色々なサイトを見てみると、コマンドプロンプトで
set RUBYOPT=-EUTF-8
と打てば解決といった人もいますが、自分はなぜか解決せず(知識ないせいでもある)

次に、システム環境変数のLANGを修正すればいいのだ!という記事を見つけたので試す。
システム環境変数は コンパネで環境変数と検索かければ出てきます。
で、詳細設定の「環境変数」をクリックするとユーザー用の変数を入れるところと、システムで入れるところが出ます。
ここは恐らく好みで大丈夫。
よし!LANGという変数を設定して値がja_JP.UTF-8でいける!!

と思ったがやはり無理。

そういえばどこかのサイトでRUBYOPTという変数を設定すればいけるという記事を見かけた。
んじゃLANGは削除して、RUBYOPTに「-EUTF-8」を入れて再起動(ログオフしてログインでもOKみたい)!

そしてKoalaを起動してコンパイルしてみたら・・・・
イケターーーーーーーーー!

ということでもしこんな記事が役に立ったら嬉しいですね。

 

--------------
追記です 2015/1/2

koalaをバージョンアップしたら同じ現象が再発。
今度はkoalaが参照しているディレクトリまでのパスの中に日本語が入っているとエラーが出てしまった。
簡単な回避法としてはディレクトリ名に2バイト文字を使用しないこと。

4,645 views

DreamweaverをSCSSに対応させたいけど困った場合

SCSSをDreamweaverに認識させるために、「Extensions.txt」と「MMDocumentTypes.xml」というファイルをごにょごにょする必要がある。

参考サイトを頼りに書き換えてみるも、反映されず。

そういった場合はProgramfile内の上記2ファイル名で検索をかけると、実は他にも同じ名前のファイルがある。
ので、それも一緒に変更を加えると幸せになれるようですよ。

参考サイト
http://k0u1.com/blog/archives/662

[追記]
マーベリックにして再度挑戦したけど上に書いてあることだけでは結局わからなかったので追記。
隠しファイルを絶対に修正しないとDreamweaverは対応しないと肝に銘じつつ。
隠しファイルを見つけるには、mac上部メニューバーの移動にマウスをあわせつつoptionを押す→隠しファイル置き場の「ライブラリ」が表示される。後はapplication support > Adobe > Dreamweaver CS6と行った感じに階層をおりていけば 「Extensions.txt」と「MMDocumentTypes.xml」は見つかる!!

1,086 views

レスポンシブルデザインで背景の高さ調整できなくない?

レスポンシブルで背景の横幅を100%にしたら高さの調整がうまくいかない事がよくある。

そんなときにもしかしたら役に立つかもしれないCSSがvh vw 。
魔法のCSSではないがうまく行けば役に立つかもしれないので備忘録。

もしくはクロップしちゃって、トリミング的な。
http://designshack.net/tutorialexamples/focalpoint/index.html

デザイナーさんもレスポンシブルを理解しないとこういう苦労が多々発生してしまうね。

参考にさせていただいたサイト。
http://hai3.net/blog/2013/01/07/css-vmin/
http://unformedbuilding.com/articles/learn-about-vw-vh-vm/

979 views

X-Serverでsvg画像が表示されない。

firebugなどで調べてもurlが間違っていると出るのでパス変更をしても反応なしフルパスで書いてもだめ。

他のサーバーでテストしてると表示されるのに、X-Serverにファイルを設置したとたん、何も表示されなかった。

ということで原因はサーバーだなということで「x-serve svg」で検索。

MIMEに関連づけしないと行けないんですね。
参考にさせていただいたサイト。
http://39kn.com/2013/12/17/6239/

やってみたけど、やはり表示されない。。。

と思ったらキャッシュですた。
背景とかって強くキャッシュ残るから注意必要ですね。
chromeのシークレットモードとかで都度チェックしないとかな。

 

2,130 views

サイトの文字を選択したときのハイライトをかえたい

たまにそういうサイトありますね。

美しいサイトはだいたいやっている手段なんだけど、あんまり実装してない事の方が多い。

自分のサイトもちゃんと作れたら実装したいね。

簡単なCSSですし。

参考にさせていただいたサイト。

http://zxcvbnmnbvcxz.com/css-selection-text/

::selection {background: #000; color: #fff;}
::-moz-selection {background: #000; color: #fff;}
603 views

うえぶでざいなー