svgなんてキライだ! | nobitaのブログ

nobitaのブログ

ご訪問ありがとうございます。
日々の雑感を中心に、
SFC修業(了)・SKI・旅行・写真・パソコン等について、
ほぼ毎日更新を目指しています。

先日よりHPをリニューアルしていますが、

 

新たに作成したページで

背景の写真をクリックすると

ポップアップする機能を導入したのですが、

ポップアップに「閉じる」・「進む」・「戻る」

ボタンがでません・・・orz

(↑背景画像をクリックし、ポップアップさせた画面)

 

サーバーにアップする前の

自分のパソコン内ではちゃんと表示されています。

 

著作権フリーのCSSでしたので

何か不具合かなとCSSの内部を調整したり

ブラウザのキャッシュを疑ったり

格闘すること2日!

 

原因がようやく判明

 

表示ボタンの拡張子がsvg形式なのですが

私の契約しているサーバーはマルウェア対策で

この形式を表示させない仕様でした!。

 

気付いてしまえば、

 

な~んだ!

 

ですが、

可能性を色々探っている段階では

なかなか行き当たりませんでした。

 

早速、CSSでsvgファイルを読み込む箇所を

pngとjpgの画像に変更

 

これで自パソコンよりサーバにアップし

ブラウザでチェックすると

(↑CSS修正後のポップアップさせた画面)

 

あら不思議!

3枚目の写真の赤楕円で囲っているように

無事表示がでました。

 

トホホな2日間でした。

では

 

追、

ボタンアイコンにも少し遊んでみました。

写真が飛行機ですので、

「進むと戻る」は飛行の向いている方を矢印がわりに

「ポップアップを閉じる」は×のかわりにスプーンとフォーク