スポンサードリンク

レスポンシブでサイトを組んでいて、768px以下の場合にbody直下のdiv要素にoverflow-y: hidden;を設定していたら「window」に対してスクロールイベントが発生しなくなった。

 

↓ これでは動かなかった

window.addEventListener("scroll", xxxFunc);

 

↓ これで動いた!

document.getElementById(body直下のdiv要素).addEventListener("scroll", xxxFunc);

 

body直下のdiv要素を指定するとスクロールイベントが発生するようになった!!

 

常識なのかもしれないですが、今まで知らなかったです…

IE6で「expected identifier, string or number」というエラーが出た。
検索したら、解決方法の記事があったのでメモ。
最後の「,」が多いと出るみたいです。




元記事「WEBPAPRIKA:IE6で「expected identifier, string or number」が出る

非常に助かりました。
ありがとうございます。

IEは難しいですね。

PC、iPhone、iPad、Androidでcssの振り分け方法を探していたらいいものを見つけたのでメモ。

CSS Browser Selector

cssに直接ブラウザ、OSを指定できるできるJSです。(php版もありました。)

こちらのサイトからダウンロードできます。
http://rafael.adm.br/css_browser_selector/

記述例)
●IE6のみ適用
.ie6 body {
 background: #000;
}

●geckoベースのブラウザのみに適用
.gecko body {
 background: #000;
}

●macのみに適用
.mac body {
 background: #000;
}

以下のOS、ブラウザに適用できるようです。
■OS
・win - Microsoft Windows (all versions)
・vista - Microsoft Windows Vista
・linux - Linux (x11 and linux)
・mac - Mac OS
・freebsd - FreeBSD
・ipod - iPod Touch
・iphone - iPhone
・ipad - iPad
・webtv - WebTV
・j2me - J2ME Devices (ex: Opera mini) ※changed from mobile to j2me
・blackberry - BlackBerry
・android - Google Android
・mobile - All mobile devices

■ブラウザ
・ie - Internet Explorer (All versions)
・ie8 - Internet Explorer 8.x
・ie7 - Internet Explorer 7.x
・ie6 - Internet Explorer 6.x
・ie5 - Internet Explorer 5.x
・gecko - Mozilla, Firefox (all versions), Camino
・ff2 - Firefox 2
・ff3 - Firefox 3
・ff3_5 - Firefox 3.5
・ff3_6 - Firefox 3.6
・opera - Opera (All versions)
・opera8 - Opera 8.x
・opera9 - Opera 9.x
・opera10 - Opera 10.x
・konqueror - Konqueror
・webkit or safari - Safari, NetNewsWire, OmniWeb, Shiira, Google Chrome
・safari3 - Safari 3.x
・chrome - Google Chrome
・iron - SRWare Iron

これは便利ですね。
早速ためしてみよう。

img要素のリンクが切れたときにonloadを通らなかったのでメモ。

IE7でimg要素のリンクが切れたときにキャッシュ??で元の画像の「width・height」をたもったまま表示しようとして崩れた。
imgにonloadでリサイズして表示枠に収めていたのだが、onloadを通らないのでリサイズされず、元のままのサイズに・・・。

色々調べてみて「onerror」にたどり着きました。
結局、リンク切れの場合にはonerrorでリサイズすることに。

IE6・8は試してません。
javascript初心者には難しいですね〜


h:1/f:1

1

スポンサードリンク