androidでviewportが効かない
2015.06.17
正しくは「androidでviewportのcontent="width=固定幅"を指定しても効かない機種がある」ということのようです。
普段は「device-width」を指定することが多いので問題にならないのですが、たまに使うたびに「あれ?」となるのでメモしておきます。

使わせて頂いているのはこちらのソース。

続:Androidブラウザでviewportのwidth指定 - to-R

いいねボタンとの絡みなど気を付けることもありますが、
viewport問題はバッチリ解決できます!
Mac版のExcelで「セルを入力可能」にするショートカット
2015.03.28

Mac版のExcelで、セルを再編集するために入力可能にするためのショートカットを探していました。F2との情報もありましたが、無効です。(WindowsではF2のようですし、随分と前のバージョンではF2だった記憶)入力の度に、マウスを掴んでダブルクリックするというのは、それなりに面倒です。

やっと見つけました。(見つけては使って忘れてしまう、ということを繰り返していたのでメモ)

「control」+「u」


ありがとうございました。
http://www.binword.com/blog/archives/000556.html

jQuery:Android 4.Xで高さが上手く取得できない
2015.03.11
詳しく調べていないのでメモ書き程度ですが、
Android 4.Xのデフォルトブラウザで遭遇した現象について。
INFOBAR A02だけの問題という可能性もあります。


・ページ読み込み時に $(window).height() でウインドウの高さを取得しようとした

・$(function(){ ... }); で取得すると、実際の高さからアドレスバーを引いたくらいの
 高さが取得される

・$(window).bind('load', function(){ ... }); で取得すると正しい高さが取得できる


Android 2.Xでは1つ目の記述で大丈夫でした。

MT6:Data API 勉強中
2015.02.04
・・なのですが、かなり初歩的なことで躓いていました。

参考サイトの通りにJSを読み込み、データを引っ張ってくる記述をしているはずなのですが、表示されない。
注意点や記述を一から見なおしてもとくに問題ないはず・・と大分困っていたのですが、
注意点にあった

・他のドメインに置かれたファイルからは読み込めない

が妙に気になり(もちろん同じサーバーに置いてはいますが)
良く確認したところ・・

●JSに記述しているURL
http://hoge.gravity-works.jp/

●ブラウザで開いているURL
http://www.hoge.gravity-works.jp/


ドメイン間違ってるし!

なんか、たびたび引っかかります、これ。。
MTは初期設定のままだと公開パスに「www」が付いているので、
サブドメインを使うときなどは気をつけようというオチでした。
JS:setIntervalを開始時にも実行
2014.12.09
setIntervalに記述した処理は、指定した秒数後に初めて実行されますが、開始時にすぐさま実行させたい場合があると思います。
今までは関数にしておいてsetIntervalと同時に呼び出したりしていましたが(大した手間ではないので)、やっぱり余計な記述はないほうが良いので調べてみました。

setInterval((function hoge() {
  // ここに処理を記述
  return hoge;
}()), 1000);

上記のように書くことで即時実行させることができます。

ソースは下記のサイト様より。
arguments.callee についても書かれていて参考になりました。

setIntervalをaruguments.calleeを使わずに0秒でも発火させる

ブラウザの戻るボタンで戻った時、画面の状態も残っている
2014.12.03
あるページAからfancyBoxのようなモーダルウィンドウを開いたままページBに移動した後、
ブラウザの戻るボタンでページAに戻ったところ、モーダルウィンドウが開いたままになっていました。
SafariとFirefoxで起こるようです。

下記のサイトで詳しくまとめられていました。

SafariとFirefoxでブラウザバック(戻るボタン)を押した際、前のページの画面効果残っている件ついてを解説

JS等のスクリプトの実行状況をキャッシュしてしまうそうです。
<header>内に下記の記述をすることで解決できます。

■通常の記述
<script type="text/javascript">
window.onunload = function(){};
</script>


■jQueryを利用した場合
<script type="text/javascript">
$(window).bind("unload",function(){});
</script>
jQuery:$(document).ready(fn)でハマったこと
2014.11.05
$(document).ready(fn)の実行はCSSが読み込まれた後。
と思い込んでいましたが、実はそんなことはなかったようです。

普通にスタイルシートでページをレイアウトし、
$(document).ready(fn)で要素の位置を取得するようなJavaScriptを書いたのですが、
どうもスタイルが当たる前の位置を取得してしまうようでした。

この時点で
$(document).ready(fn)が実行される = DOMの準備が出来ている = CSSの読み込みも終わっている
という思い込みをしていたのでハマってしまったのですが、
記述の順番次第でCSSの読み込み前にJSが実行されてしまうようです。

英語ですが、こちらのやり取りの中で解説されています。
http://stackoverflow.com/questions/1324568/is-document-ready-also-css-ready

CSSの読み込みはJSの読み込みより先に記述しないと保証されないようです。

<link rel="stylesheet" type="text/css" href="aaaaa.css" />
<script type="text/javascript" src="jquery.js">
<script type="text/javascript" src="bbbbb.js">

この順番であれば大丈夫です!

DW:正規表現で「改行含むすべての文字列」を指定する方法
2014.10.22
Dreamweaverの検索では正規表現を使うことができます。
その正規表現で、「改行含むすべての文字列」をヒットさせるための記述です。

<!-- header -->
<div id="header">

</div>
<!-- /header -->

を検索する場合、

<!-- header -->
<div id="header">
(.*\r\n){0,10000}.*?
</div>
<!-- /header -->

となります。

こうすることで <div id="header">~</div> の中身が複数行でも、
ページによって微妙に違っても検索することができます。

一括置き換えの際などに。

注意点としては、終わりの文字列を「</div>」のように綴じタグだけにしてしまうと、
ページ内に複数あるため一番最後の綴じタグまでが範囲になってしまうということです。
上記のようにコメントアウトまで含めて検索するなど、
上手くページに1箇所しかない文字列を指定しましょう。


コードはこちらの記事からそのまま使わせていただきました。
探してもズバリなものがなかなか見つからなかったので、とても助かりました!
【正規表現】Dreamweaverで改行を含むコードの一括置換|俺メモ Web時々アプリ | OREMEMO

MT5:出力されるデータを分割するプラグイン
2014.08.06
MTタグで出力されるデータを任意の文字で分割することができるプラグインです。
GoogleMap用に入力しておいた、経度と緯度をカンマで繋いだデータを
再利用する際に利用させていただきました。

■SplitModifier 0.1.1
http://gabs.cc/blog/bun/topic20110301-1610.php


■使い方

1. ダウンロードし、「MTディレクトリ/plugins/」にアップ。


2. 分割したいMTタグに、splitモディファイアとsetvarモディファイアを追加。
  splitモディファイアには分割する際に区切りとなる文字、
  setvarモディファイアには分割後のデータ数を格納する変数名を入れます。

  <$mt:GoogleMap$>
    ↓
  <$mt:GoogleMap split="," setvar="cnt"$>


3. 分割されたデータは「var_n」という変数に格納されます。
  1つ目のデータは<$mt:GetVar name="var_1" $>、
  2つ目のデータは<$mt:GetVar name="var_2" $>とすることで取得できます。


今回のように、登録してあるデータを想定外の用途に使用しなければならないことは意外に多い気がするので、これからもお世話になりそうです。
ブラウザが position:fixed に対応しているか確認するJS
2014.07.09
※14/7/9
いくつか問題点?を確認したため記事下部に追記しています。


ようやく旧IEが減ってきて、これで心置きなく position:fixed が使える・・
かと思いきや、スマホでもiOS4以下やAndroid2.X以下は非対応なので、まだしばらくは対策が必要なようです。

そこで、ブラウザが position:fixed に対応しているかを確認できるJSを探してみました。

position:fixedに対応しているかどうか判定する

こちらで紹介されているJSが簡単そうです。


■ダウンロード
GitHubのページに行ってダウンロードします。


■HTMLに記述
HTMLのヘッダー内に記述します。
jQueryを使用しているので、jQueryも忘れずに。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="jQuery.support.fixedPosition.js"></script>

■実行
同じくヘッダー内にて実行します。
下記のように書くと、対応していれば「true」、非対応なら「false」が返ってきます。

<script>
$(function(){
	alert($.support.fixedPosition);
});
</script>


※ここから追記

上記の状態でテストしていて気付いたことがありました。

・ページがスクロールバーの出ない長さの場合、非対応でも「true」が返ってくる(iOS4/Android2.X)

・スクリプト実行時にスクロール位置がページ最上部(X=0)の場合、非対応でも「true」が返ってくる(Android2.X)

ちょっとこのままでは十分に使えそうにないので、
何かしら対応できないか試してみようと思います。

月別アーカイブ