スタッフブログ

2012/10/09

ホームページやブログに地図を挿入する場合にGoogle Mapsを利用することが多いと思います。無料かつ簡単に地図を挿入できるので重宝しますよね。ただデフォルトの方法で貼付けると、吹き出し(バルーン)が大きすぎて邪魔なことあります。ちょっとソースを変更するだけで簡単に削除することが可能です。

■変更手順
コピーしたソースから「embed」の文字を探します。
すぐ後ろに</iframe>という記述があります。

さて、この embed のすぐ後ろに &iwloc=B を追加します。

するとGoogle Mapsの吹き出しが削除されます。

続きを読む



2012/07/23

セレクタとは一例ですが、「a:hover」の「:hover」のことです。「:」以降に指定した条件でCSSを変化させたい場合に使われます。

CSS3のセレクタには、従来HTMLとCSSの組み合わせで実現してきた表現をCSSだけで実装できる便利な物が多数存在します。少し例をあげますと

「:first-child」要素の最初の子要素のみCSSを適用
「:last-child」要素の最後の子要素のみCSSを適用
「:nth-child() 」要素の何番目かの子要素のみCSSを適用。

最後のliや偶数のliにCSSを適用させたり、3つおきにCSSを適用させるなどは重宝しますよね。
これまで最後のliタグにCSSで装飾したい場合、<li class=”last”>などHTMLにクラスを記述しCSSを適用させてきましたが、CSS3セレクタならスタイルシート「li:last-child」に適用させたい内容を記述するだけで完了です。

ただIE6からIE8が対応していないため残念ながら使用されないケースが多いです。
Selectiveizrは、JSライブラリと連携しCSS3セレクタをIE6からIE8に簡単に適用させることが出来ます。

以下、覚え書き

selectivizr css3セレクタをIE6からIE8で使う

続きを読む



2012/02/27

「Yahoo!JAPAN」がIE6ユーザーに対してバージョンアップを促すメッセージを発信していますよね。「Yahoo!JAPAN」は、2011年12月中旬から順次、Internet Explorer 6(IE6)のサポートを終了しています。

GoogleもGoogle DocsとGoogle Sitesなどでサポート廃止を発表していますし、FacebookもIE7以上が推奨されています。

企業の基幹システムではIE6が、まだ使われていると思われますが、別の手段でネットを見ている方も多いだろうと思い、当社サイトも2012年よりInternet Explore6(IE6)のサポートを段階的に終了しております。※IE6に対応したホームページ制作自体は承らせて頂いております。

IE6サポート終了に伴い、IE6ユーザーに対してるメッセージを出す、jqueryプラグイン「ie6hack_overlays.js」を利用しています。

以下、覚え書きです。

続きを読む



2012/02/17

IE6など古いバージョンのInternet ExplorerにCSS3を適用させる方法で、以前「IE-CSS3」をご紹介したのですが、「PIE.htc」の方が対応しているプロパティも多く、また動作が安定していて良さそうな印象を持ちました。

角丸、ボックスシャドウ、グラデーション、マルチバックグランドなどが利用可能になります。

以下、覚え書きです。

続きを読む



2012/02/06

バタバタしていて久しぶりの更新になってしまいました。

ちょっと覚え書き。

IE6やIE7はz-indexの解釈が他ブラウザと異なり、同一階層間での重ね順の前後を指定するもので、 グローバルに前後を指定するものではない形みたいです。

なので各階層で後に書かれたものが上のレイヤーにのり、 深い階層でどんなにz-indexを操作しても、 その要素を含む浅い階層でz-index指定されていなければ、思いどおりの表示にはできないようです。



2011/11/11

CSS3には、角丸やドロップシャドウを表現する機能があり便利なのです、残念ながらInternet Explorer6,7,8が非対応のため利用できなかったりします。

角丸など画像を1つ1つ作成するのが、あまり効率的でないので僕は、javascript「DD_roundies」で角丸を表示することが多いです。
ただIE8でCSSで背景画像を利用している箇所で1pxずれたり、IE9にどうも対応していないようで別の方法を少し調べてみました。

「IE-CSS3」が便利かつ簡単に利用できそうです。
以下、覚え書きです。

続きを読む



2011/06/02

Internet Exploreは、スタイルシート(CSS)でボックスにwidthが入っていると垂直のマージンが相殺されないですよね。E8は相殺されるようですけど。結構忘れてしまうので覚え書きしときます。

あとIE6だけマージンが2倍になってしまうバグは、「display:inline;」で解決します。

続きを読む



2010/05/24

Flash(フラッシュ)をhtmlに挿入する定番といえば「SWFObject」ですよね。
Flash Playerの有無、バージョンの検知、Web標準に準拠したコードを想定した実装方法などがスタンダードになっている所以でしょうか。

SWFObjectにはスタティックパブリッシングとダイナミックパブリッシングの2つの利用方法があります。スタティックパブリッシングはJavaScriptが無効、またはJavaScriptをサポートしていないブラウザでもFlash Playerのバージョンを検知できます。ダイナミックパブリッシングはJavaScriptが有効である必要がありますが、コードがシンプルらしいです。

当ホームページでは、スタティックパブリッシングを採用しております。以下、覚え書きです。

続きを読む



2010/03/04

透明感のあるデザインをHTMLでコーティングする場合、Internet Explore6(以下IE6)が、透過PNG画像の表示に対応していない事がネックになるケースがあると思います。

下記画像のように透明部分が、グレーで塗りつぶされた形で表示されてしまいますよね。
現在でも、20%位のシェアを持つブラウザなので無視する訳にもいかず、本当にWebデザイナー泣かせです。

Internet Explore6(IE6)での透過PNG表示例

透過PNGがIE6でも使えるとデザインの幅を広げられるので、かなり嬉しいですよね。
IE6で透過PNGを表示させる方法はいくつかありますが、当サイトでは、組み込みが簡単な点や、「img」だけでなく背景等にも対応していること、またWeb標準に準拠したコーディングで利用できることから、「IE PNG Fix v2.0」を利用しています。

続きを読む



2010/03/01

Internet Explore8などで「セキュリティで保護されたWebページ コンテンツのみを表示しますか?」とアラート(エラー)表示される場合があります。

secu_msg.png

アクセスしたコンテンツの一部が非SSL経由で参照されている場合に、このポップアップ画面が表示されるそうです。
以下のケースが原因の用です。

続きを読む



ホームページでお困りのことはございませんか?

ホームページのリニューアルや新規WEBサイト制作など、あなたのアイディアをお聞かせください。
そのアイディアを当社の技術で形にします。ホームページ制作をご依頼されるのが、初めての方でも丁寧に対応いたしますのでご安心ください。
お見積もり・ご相談は無料ですので、お気軽にご相談ください。

お問い合わせはこちら

PAGE TOP