初めて質問します。現在、ブログを運営していますが最近になってHighSlideを導入してみました。記事中の画像はサムネイルで表示され、今までだと別ウインドウにオリジナルを表示するようにしていたのですが、HighSlide導入後は画像がズーム&ポップアップされなかなか楽しめています。
ただ、HighSlideを設定した画像はサムネイル上にマウスカーソルを持ってきたときに画像の枠が消え、画像がやや下方にずれていきます。今までだとこういったことはありませんでした。hoverなどが設定されているのだろうかとHighSlide.jsを探してみましたがなさそうな感じです。参考までにURLを記載しますので、どういった理由が考えられ、どういった対策が取れるのかをご教示下さい。なお、確認環境はMacOSX 10.4.11/FireFox3.0.3/Safari3.1.2です。
http://sceadu.blog.shinobi.jp/
最近の3記事についてはHighSlideを、それ以前の記事については今まで通りの表示方法にしています。なお、当方で使っているHighSlide.jsは以下のURLで参照できます。
http://file.sceadu.blog.shinobi.jp/highslide.js
よろしくお願いいたします。
No.1ベストアンサー
- 回答日時:
挙動としては、borderの幅が変わってるなぁという感じで。
原因は、問題の画像達はA.highslideの子孫であるだけじゃなくて
div.EntryTextの子孫でもあることですね。指定の順番からかな、標
準ではEntryTextで指定した1px幅rgb(102,102,102)色のborderが描
かれていて、hoverするとhighslide:hoverの2px幅white色のborder
に切り替わってます。highslideの2px幅gray色のborderは使用され
ていません。
highslideの指定をもっと後ろに持ってくるか、指定の詳細度をあげ
る工夫が必要ですね。highslideのborderを1px幅にしてもいいけど。
この回答への補足
grumpy_the_dwarfさま
早速のご回答ありがとうございます。専門的な立場の方とお見受けいたしま
すが、当方なにぶん素人のためなかなか理解できません。highslide.jsをテキ
ストエディタで見てもhoverは検索にかかりません。
>highslideの指定をもっと後ろに持ってくるか、指定の詳細度をあげ
>る工夫が必要ですね。highslideのborderを1px幅にしてもいいけど。
「指定を後ろに持ってくる」「指定の詳細度を上げる」「highslideの
borderを1px幅にする」の具体的なご指示をいただくことはできません
でしょうか?何度も申し訳ありませんm(__)m
grumpy_the_dwarfさま
何度も書き込み申し訳ありません。その後、いろいろとソースを見ていまし
たら忍者ブログのテンプレート設定があることを思い出しました。テンプ
レート設定でhighslideのCSS部分を見てみましたら、ご指摘の
.highslide:hover img {
border: 2px solid white;
}
があり、この部分を1pxにすることで解決しましたまた、solid white;を
solid gray;に書き換えることで特に違和感なくマウスオーバーできるよう
になりました。ここで質問させていただいたおかげです。どうもありがと
うございました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- Windows 10 Windows10の画像ファイルのサムネールがアイコン表示になってしまいました。 3 2022/07/09 13:01
- HTML・CSS 詳しい方に質問です。 早急に解決したいと思っています。 ポートフォリオをMacBook で作成したと 2 2023/05/12 17:40
- Windows 10 フォルダ内の全ての画像を矢印キーでスライドできるようにしたい 1 2022/10/21 12:53
- 画像編集・動画編集・音楽編集 エクスプローラー サムネイル表示されない 1 2022/12/22 10:14
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- 防犯カメラ・監視カメラ・小型カメラ VHSを高画質な動画ファイルにしたいです。 3 2022/05/06 12:08
- Excel(エクセル) EXCELのグラフを画像(JPG形式)で保存、通常実行がうまく行かない。ステップインはうまく行く 3 2022/08/30 12:06
- PHP 掲示板を資料を参考にして開発中ですが、画像がアップされません? 1 2022/11/21 06:44
- Windows 8 Route Generator の使い方 1 2023/05/03 00:36
- YouTube Win10 Youtubeの動画を開くと、必ず右下に設定ダイアログ?が表示されます 2 2023/03/26 11:35
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
iPadのスクリーン座標のサイズ...
-
Input Type Buttonのサイズ変更
-
横幅が狭いホームページ
-
スタイルシートの"_width"って...
-
Macで画像の切り抜きできないの?
-
PNG画像の余白をカットする方法...
-
htmlの文字が縦書きになる
-
リンクを知らせる手のマークが...
-
widthやheightの数値に単位(px...
-
htmlのolやulなどlistにtitleや...
-
「諸要素」とはどういう意味で...
-
含む含まないという概念自体の...
-
【ヒトの神秘】美男美女から何...
-
画像イメージの上下左右、欲し...
-
HTML属性での「""」 「''」違い
-
複数のボタンを等間隔に、かつ...
-
テキストボックスの中にリンク...
-
ボタンをセル内一杯に表示させ...
-
CSSに同じclass名がいっぱい‥。...
-
CSS, リンクの色を一部変えるに...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
Macで画像の切り抜きできないの?
-
iPadのスクリーン座標のサイズ...
-
ヘッダーデザインをするさい形...
-
HTMLソースの中で、画像を表示...
-
iPhone Safari 画像の幅指定が...
-
テーブルのセル内のマージン
-
スタイルシートの"_width"って...
-
cssで点線を表示する方法
-
サムネイル自動生成プラグインn...
-
ボタンの配置
-
画用紙 26cm×37.5cmは 何px で...
-
Pythonでエクセルファイルの列...
-
十進BASICでのプログラム
-
横幅が狭いホームページ
-
横幅が2880pxを超えるデザイン...
-
ベイシックのプログラミングに...
-
スペーサーGIFの作り方
-
ブラウザ上で画像が縦長に表示...
-
FEDORA15のアイコンを小さくしたい
-
htmlの文字が縦書きになる
おすすめ情報