お世話になります。
管理人です〜。
いや、完全に関係ないわけではないので、
よろしければ、時間をかけて投稿していただいたので残していいですか？
こういう知識が、財産として蓄積されます。
基本的に、投稿された投稿内容は、削除は受け付けていないことになっています。
グローバルナビブロックで、ページの名前の背景に画像を重ねたい。
2015年11月16日 at 1:17
グローバルナビブロックで、ページの名前の背景に画像を重ねたいと思っています。
「ホーム」「ページ１」「リンク」それぞれに共通画像を重ねたい。
＜veiw PHP＞消えてしまうので全角です、読みづらくですいません。
ｅｃｈｏ ’＜ａ ｈｒｅｆ＝”’ ． ＄ｎｉ－＞ｕｒｌ ． ’” ｔａｒｇｅｔ＝”’ ． ＄ｎｉ－＞ｔａｒｇｅｔ . ’” ｃｌａｓｓ＝”’ . ＄ｎｉ－＞ｃｌａｓｓｅｓ . ’”＞ ＜ｉｍｇ ｃｌａｓｓ＝”ｈａ” ｓｒｃ＝”’ . ＄ｔｈｉｓ－＞ｇｅｔＴｈｅｍｅＰａｔｈ（） . ’／ｉｍａｇｅｓ／ｍｅｎｕ＿ｂａｒ.ｊｐｇ” ｂｏｒｄｅｒ＝”０”＞＜ｆｏｎｔ ｃｌａｓｓ＝”ｍｏｚｉ”＞’. ＄ｎｉ－＞ｎａｍｅ.’＜/ｆｏｎｔ＞＜／ａ＞’；
＜CSS＞
.mozi {margin: 59px 0;}
上記の様に指定したのですが、変化（移動）してくれません。
現状、画像の下方に文字（ホーム）等が並んでいる状態です。
いろいろ試してみたのですが解決方法が見当たりませんでした。
よろしくお願い致します。
Re: グローバルナビブロックで、ページの名前の背景に画像を重ねたい。
2015年11月18日 at 17:49
管理人様、削除の件は了解しました。
折角なのでやりたかったことを残しておきます。
グローバルナビブロックの背景画像の上にカーソルを乗せた時に
別な画像をフェードインで表示（選択している風に）させたかった。
フェードインで表示させる画像をCSSで最下層に設定。
.gnav li {background: url(images/maru01ba.png) no-repeat center center; }
何もしていない時の標準画像をPHPで中間層に設定。
＜ｉｍｇ ｃｌａｓｓ＝“ｈａ“ ｓｒｃ＝”’ . ＄ｔｈｉｓ－＞ｇｅｔＴｈｅｍｅＰａｔｈ（） ． ’／ｉｍａｇｅｓ／ｍｅｎｕ＿ｂａｒ.ｊｐｇ“ ｂｏｒｄｅｒ＝”０”＞
最下層がフェードインに”見えるように”、標準画像をフェードアウトするのをＣＳＳで設定。
.gnav li a img {transition: opacity 0.8s ;}
.gnav li a:hover img {opacity: 0;}
無理やりな、力技なような気がするのでもっといい方法があればよいのですが。
折角なのでやりたかったことを残しておきます。
グローバルナビブロックの背景画像の上にカーソルを乗せた時に
別な画像をフェードインで表示（選択している風に）させたかった。
フェードインで表示させる画像をCSSで最下層に設定。
.gnav li {background: url(images/maru01ba.png) no-repeat center center; }
何もしていない時の標準画像をPHPで中間層に設定。
＜ｉｍｇ ｃｌａｓｓ＝“ｈａ“ ｓｒｃ＝”’ . ＄ｔｈｉｓ－＞ｇｅｔＴｈｅｍｅＰａｔｈ（） ． ’／ｉｍａｇｅｓ／ｍｅｎｕ＿ｂａｒ.ｊｐｇ“ ｂｏｒｄｅｒ＝”０”＞
最下層がフェードインに”見えるように”、標準画像をフェードアウトするのをＣＳＳで設定。
.gnav li a img {transition: opacity 0.8s ;}
.gnav li a:hover img {opacity: 0;}
無理やりな、力技なような気がするのでもっといい方法があればよいのですが。
abo
Re: グローバルナビブロックで、ページの名前の背景に画像を重ねたい。
以下のようにしたところ、うまく重なりました。
元画像サイズは高さ59px
＜CSS＞
.mozi { position : relative; top: -39.5px;}
目測でセンター合わせにしたら、妙な数字になったのですが理由は不明です。
質問内容はコンクリート5に関係がなさそうな気がしてきたため、
管理人さんがいましたらこのスレッドは削除して頂けると助かります。