htmlの最近のブログ記事

グーグルマップおもしれー。


    <script type="text/javascript">
    function initialize() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map_canvas"));
        //座標を設定
        var point = new GLatLng(<MTIfNonEmpty tag="cfgooglemappoint"><MTcfgooglemappoint></MTIfNonEmpty>);
        //初期位置 軽度,緯度,縮尺
        map.setCenter(point, 13);

        //マップコントロールパネル表示
        map.addControl(new GLargeMapControl());
        //右下ミニマップの表示
        map.addControl(new GOverviewMapControl());

        //ふきだし設置 位置, ノード(文章)
/*
        map.openInfoWindow(map.getCenter(), document.createTextNode("あああああ"));
        if(!map.infoWindowEnabled()){
            map.enableInfoWindow();
        }
*/
        //スクロールホイールでのズームイン・アウトを有効
        if(!map.scrollWheelZoomEnabled()){
            map.enableScrollWheelZoom();
        }

        //滑らかに拡大縮小を行うを有効
        if(!map.continuousZoomEnabled()){
            map.enableContinuousZoom();
        }

        // ===== マーカーとフキダシ(変更不要) =====
        function createMarker(point,html) {
            var marker = new GMarker(point);
            GEvent.addListener(marker, "click", function() {
                marker.openInfoWindowHtml(html);
            });
            return marker;
        }
        
        // ===== ポイント設置設定、前が緯度(Lat)、後が経度(Lng) =====
        var point = new GLatLng(<MTIfNonEmpty tag="cfgooglemappoint"><MTcfgooglemappoint></MTIfNonEmpty>); //★位置設定
        var marker = createMarker(point,'<div style="width:310px; padding:8px; background-color:#ececec; font-family:Courier; border:solid 1px #cccccc;" ><$MTEntryTitle$> <MTcfshoptitlejp> [<MTcfshoparea>]</div><br /><MTcfaddress>'); // ★
        map.addOverlay(marker);
        marker.openInfoWindowHtml(html);

      }
    }
    </script>
 
CSSでmargin要素を指定して何故か利かない! なんでなんDA☆!

\(^o^)/


とか思ったそこの可愛そうなキミ!各言う私もでしたごめんなさい・・・
tableのtdタグにはmarginは使えませぬ。なのでpaddingで対処するでござるよ。

<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">

をFireFox2.0.0.9 (07/11/15時点日本語版最新バージョン)、InternetExplorer6.02900.2180xpsp_sp2の環境にて<table>タグ内<td>~</td>要素に、CSSでheight:○○px; overflow:hidden;属性を指定してもまったく有効になりません。


我らがwindows XP Internet Explorer ver6ではflashコンテンツを一度クリックしてアクティブ化しなければなりません。これは使うユーザ側にとっては非常に邪魔なものに他ならないことでしょう。

では、このコントロールアクティブ化を消すにはどうすれば良いのか?
答えは、

objectタグやembedタグを使わず、javascriptでflashコンテンツをソースに入れる

ことです。これは見落としになりがちですが、ユーザビリティを考える上では非常に重要なことだと思います。

ver1.1 アクティブコンテンツ埋め込み用外部javascriptファイル
(無断転載しております。お手数ですが禁止事項にあたる場合eregance@mail.goo.ne.jpまでメールを頂ければ幸いです。)

このファイルを適当なhogehogeディレクトリに入れて、HTMLソースの<head>~</head>部分に

<script src="hogehoge/AC_RunActiveContent.js" type="text/javascript"></script>

このようにリンクし、flashを入れたいところにnonscriptにあるように従来通りのコードに加えて、下記の太字部分を追加して、太字の部分、swfの縦横のサイズやパスを変更すれば導入できます。
解りにくい説明で申し訳ありません。

swfファイルへのパスを設定する際、swf/hogehoge.swf とするのが普通ですが、このjavascriptの場合「 .swf 」の拡張子の部分はファイルパスとして記述しなくても大丈夫です。
ややこしいので間違えないように。

<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0','width','横幅200','height','高さ100','src','ファイルパスhogehoge','quality','high','pluginspage','http://www.macromedia.com/go/getflashplayer','movie','../navifla/produce_main' ); //end AC code
</script>

<noscript>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="横幅200" height="高さ100">
<param name="movie" value="ファイルパスhogehoge.swf">
<param name="quality" value="high">
<embed src="hogehoge.swf" quality="high" pluginspage="http://www.macromedia.com/jp/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="200" height="100">
</embed>
</object>
</noscript>


Dreamweaver8を使われているのであれば、flashを[挿入→Flashファイル]で埋め込む際、自動でjavascriptを挿入させる修正パッチ(ver8.02)が出ていますので、そちらをご利用下さい。


ぶっちゃけると、javascriptのDocument.writeでobjectタグ、embedタグを直接HTMLに書き込んでしまえば、ActiveXのコントロールをアクティブにするなどというワンクリック詐欺まがいの問題は出ません。
普通にflashが配置されます。
flashコンテンツが1つの場合はDocument.writeを使ったほうが便利かもしれません。


参照:
Adobe
アクティブコンテンツのアップデートに関する記事
Dreamweaverリリースノート

Microsoft MSDN
ActiveXコントロールのアクティブ化:テクニカルノート

BROADCASTing

うにくろっく

pulltaBlogParts ばーじょんべーた

ごめんなさい無断転載しております。 引用元忘れました。まずい場合はご連絡ください。直ちに取り消します。

このアーカイブについて

このページには、過去に書かれたブログ記事のうちhtmlカテゴリに属しているものが含まれています。

前のカテゴリはflashです。

次のカテゴリはjavascriptです。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。

Powered by Movable Type 4.1

2008年11月

            1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30