Re: Gnaviモジュールの地図表示の復帰
タツ
投稿数: 2447
Gnaviモジュールでマーカーをクリックし情報ウィンドウ(infoWindow)を出すとどうしても上下左右にスクロールが表示されとても見にくい。また、多分スマホなんかでは大きすぎるのではとこの情報ウィンドウを編集することにしました。
この編集に関し、前提としてサイトがCSSにて画像が幅によって拡縮できることが条件です。因みに本サイトでは"image"というCSSが使われています。
取り敢えず幅は180pxとして決め打ち
html/modules/gnavi/js/map.jsを編集してみた330行目辺り
これを単にwidth:250px→width:180pxに変更
これだけだと写真はレスポンシブのcssによって適当なサイズに縮められるがどうもうまく上下左右のスクロールが消えない。そこで
xoops_trust_path/modules/gnavi/main/kml.phpを編集。146行目辺り
これをheight→max-height さらに"image"というCSSを追加して
と変更すればうまく収まりましたが、縦の写真については長さが長いためかやはり上下左右にスクロールが表示されてしまう。従って写真が縦長の場合は幅を94pxと制限するようにこの部分をさらに編集しました。
現時点では各Gnaviモジュール(ソロツーリングと旅の地図、世界の旅と地図、明石観光と全国宿特集)の情報ウィンドウでは写真の縦横に関係なくスクロールが消えています。ただ、写真の縦横の比率があまりにも違う特殊な場合は不具合が発生するかも知れません。
この編集に関し、前提としてサイトがCSSにて画像が幅によって拡縮できることが条件です。因みに本サイトでは"image"というCSSが使われています。
取り敢えず幅は180pxとして決め打ち
html/modules/gnavi/js/map.jsを編集してみた330行目辺り
gn_desc[lid]="<div style='width:250px;'><a href='"+gn_url+"/index.php?lid="+lid+u+"'>"+name+"</a><br />"+description+"</div>";
gn_desc[lid]="<div style='width:180px;'><a href='"+gn_url+"/index.php?lid="+lid+u+"'>"+name+"</a><br />"+description+"</div>";
xoops_trust_path/modules/gnavi/main/kml.phpを編集。146行目辺り
$h = $y>0 ? "style='height:".$y."px;margin:5px;'" : "" ;
$desc = "<div align='center' $h><a href='$mod_url/index.php?lid=$lid$op_link'><img src='$imgsrc_photo' /></a></div>".$desc;
$h = $y>0 ? "style='max-height:".$y."px;margin:5px;'" : "" ;
$desc = "<div align='center' $h><div class='image'><a href='$mod_url/index.php?lid=$lid$op_link'><img src='$imgsrc_photo' /></a></div></div>".$desc;
if ($y>0 && $rs['res_x'] > $rs['res_y']){
$h = "style='max-height:".$y."px;margin:5px;'" ;
} elseif ($y>0 && $rs['res_x'] < $rs['res_y']){
$h = "style='width:94px;margin:5px 43px 5px 43px;'" ;
} else {
$h ="";
}
$desc = "<div align='center' $h><div class='image'><a href='$mod_url/index.php?lid=$lid$op_link'><img src='$imgsrc_photo' /></a></div></div>".$desc;
現時点では各Gnaviモジュール(ソロツーリングと旅の地図、世界の旅と地図、明石観光と全国宿特集)の情報ウィンドウでは写真の縦横に関係なくスクロールが消えています。ただ、写真の縦横の比率があまりにも違う特殊な場合は不具合が発生するかも知れません。
投票数:13
平均点:5.38
投稿ツリー
-
Gnaviモジュールの地図表示の復帰
(タツ, 2018/10/1 22:13)
-
Re: Gnaviモジュールの地図表示の復帰
(タツ, 2019/3/15 9:01)
- Re: Gnaviモジュールの地図表示の復帰 (タツ, 2019/6/27 20:56)
-
Re: Gnaviモジュールの地図表示の復帰
(タツ, 2019/3/15 9:01)