- 1Columun 4BOX
- #header>#content>#menu>#footer
- XML宣言あり
- 文字コード:UTF-8
月: 2008年2月
[JS]Javascriptの有効・無効でCSSを変更する
javascriptが無効の時、有効で使ってるCSSだと表示がおかしくなる場合の回避方法について。
最近作ったサイトが、コンテンツの表示をmootoolsで動かしていて(スライドとかで)、javascript無効にすると まったく見えない状態になってしまう。
XHTMLソースを変更しているわけではないので、CSSだけ変更すれば見れる状態になる。(CSS無効でもXHTMLだからそれなりに見れる)
というわけで、javascriptの有効・無効でCSSを変更する方法についてのメモ。
[mootools]クリックでフェードインアウトさせる
ボタンやリンククリックでフェードインアウトさせるサンプル。
※このサンプルは前バージョン(1.1.2)で書いたものです。追記で1.2の解説もしてます。
[CSS] YUI Fonts CSS でフォントサイズを相対指定する
デザイナーは絶対指定で(つまりpx指定)自分が作ったラフ通りガッチガチに固定しろと主張する人がまだ多いと思うが、巷の流れに乗るなら相対指定にして然るべきという感じ。
しかし、いざ相対指定しようとしたら単位とか数値とかに迷ったりする。
emすら絶対指定だと切り捨てる厳しい人もいるらしいし、相対は継承されるから指定が難しい…
思ったサイズにならないこともしばしばある。
フォントサイズ固定してなきゃデザインが崩れる、なんてのもありがちで。
そこでこのブログのテーマVicunaでも使われてるYUI Fonts CSSの出番です。
[CSS]overflowとpositionを使うとスクロールできなくなる(IE)
外の要素にoverflow:autoなどを指定し、中の要素にposition:relativeを設定したとき、IEではスクロールバーが出てもスクロールがされない。 IE6 bug with overflow and po … 続きを読む
Transparency GoogleMaps
GoogleMapを透明にしたいしたい!と言い出して作ったボツになった方をこっちにのせとく…。
CSSで半透明というのではなく、陸の部分だけ不透明で他透明ということをやりたかった。
透過GIFのほか、アルファチャンネルpngも使用出来る。(しかもpngはIEでも表示される!)
AptanaStudio1.1日本語化
AptanaStudioを日本語化する手順。 この手順を踏めばAptanaの9割が日本語になる。 Pleiades1.2.1をダウンロード&解凍 Aptanaのフォルダに、解凍したPleiadesフォルダ内にあるfeat … 続きを読む
[mootools]ボタンでスタイルシートを切り替える(Cookie使用)
mootoolsを使ってスタイルシートを切り替えるサンプル。
※このサンプルは前バージョン(1.1.2)で書いたものなので1.2では動かないかも
ベースのCSSをlinkさせておいて、クリックでCSSファイルを切り替えるようにする。
ボタンをクリックしたときCookieを発行し、リロードしたら記憶させたCSSファイルを読み込んで表示する。
リロードしても選択したCSSを表示する動作になるが、Cookie読み込んだりAssetしたりというJavascriptの動作分だけ、CSSが切り替わるのにタイムラグが発生する。
Assetよりsrcだけ書き換えた方がいいのかも。
書き散らしたから汚い…
GoogleMap IEだけ出るエラーの原因
GoogleMapを入れたページをブラウザで確認したとき、FireFoxやSafari、IE7などではエラーが出ないのに何故かIE6系のブラウザだけエラーを吐くことがある。 主なものは ‘GMap’ … 続きを読む
ColorMe!ShopProテンプレート作成について
WinXP(sp2)でIE7からIE6に戻す
うっかり屋専用メモ。IE7からIE6に戻す方法を色々検証
システム復元
インストール時期が古いと復元できないことが多い。
IEOE再インストールヘルパー
IE7をアンインストールした後出るダイアログを、レジストリ操作かなんかで消してくれる
SP2だとダメっぽい
レジストリ操作
あまりオススメしないが…。
GoogleMapSample10:ポリィラインのエンコード
ポリィラインなのかポリーラインなのか未だに読み方が分からない件。
複雑なポイント設定のあるラインを地図に引きたい場合はこちらが最適。
公式サイトにあるInteractive Polyline Encoder Utilityにて、ラインのエンコードが出来ます。
GoogleMapSample9:地図にシンプルなラインを引く
地図の上にポリィラインと呼ばれる線を引く。公式サイトにあるサンプルです。
ポイントを増やせば複雑な線も引けるが、複雑な線はラインのエンコードを使った方が楽。
GoogleMapSample8:複数のマーカーを表示
1つのマップに複数のマーカーを表示する。
ColorMe!ShopPro if文とか
ColorMe!ShopProのテンプレート構築で欠かせないif文とかについての解説。
if文というのは英語の意味と同じで「もし~ならば」という動作をする。
処理に説明をつけると次のようになります。
[smarty]
<{if (条件)}>//もし(条件)ならば~
(条件に該当する場合の処理)を実行
<{else}>//あてはまらなければ~
(条件に該当しない場合の処理)を実行
<{/if}>
[/smarty]
GoogleMapSample7:XMLと非同期RPC(“AJAX”)の利用
サーバー上にあるXMLファイルを読み込んでマーカーを表示する。
公式サンプルそのまま。
GoogleMapSample6:コントロールの追加
地図を操作するコントロールを追加する。
追加できるコントロールは、拡大縮小、移動、地図タイプ、縮小地図、マウスホイール操作。
GoogleMapSample5:マーカーのカスタマイズ+クリックで情報ウィンドウ
自作のマーカーも使える。変数を変えれば数種類のマーカーを使い分けることが出来る。