どうしたの？: アコーディオンは正常に動作していますが、タブがアコーディオンの右側に表示されます。
jQuery
$(document).ready(function(){
$(".accordion .title").click(function(){
$(this).next(".accordion .details").slideToggle(500)
}).next().hide();
});
CSS : ホバーボックス
.hoverbox
{
cursor: default;
list-style: none;
} .hoverbox a {
padding-top: 5px;
cursor: default;
text-decoration: none;
color: black;
} .hoverbox a .preview {
display: none;
} .hoverbox a:hover .preview {
display: block;
position: absolute;
top: -33px;
left: -45px;
z-index: 1;
} .hoverbox img {
vertical-align: top;
height: 125px;
} .hoverbox li {
display: inline;
float: left;
margin: 3px;
padding: 5px;
position: relative;
text-align: right;
text-decoration: none;
} .hoverbox .preview {
border-color: #000;
height: 300px;
} .gallery {
width: 100%;
}
HTML : 1 画像のサンプル。
<div class="accordion">
<div class="title"><h2></h2></div>
<ul class="details">
<div class="gallery">
<ul class="hoverbox">
<li>
<a href="#">
<img src="pictures/1.jpg" class="thumbnail"/>
<img src="pictures/1.jpg" class="preview"/></br>
Compass
</a>
</li>
</ul>
</div>
</ul>
</div>
まず、ロードしたばかりのアコーディオンから始めましょう。
「Glass Windows」をクリックすると、次のようになります。
私がやったこと：過去4、5日間、タグの再配置に何時間も費やし<div>、コードが正しいことを確認し、CSSに手を出しました（具体的には、テキストが奇妙に配置されていないか、方法についておかしなことがあったことを確認しました画像が表示されました）。あまり具体的ではありません、私は知っています。短く簡潔ではない質問で申し訳ありません。
アップデート
Dexter の提案を使用しようとしましたが、テキストの配置にまだ問題があります。
セクション 1 をクリックすると...
そして第2節…
前述のように、各セクションは互いに下にある必要があります。ビデオセクションはアコーディオンから分離されており、ホームはページの下部にあるナビゲーション リストの一部です (フッターとして機能します)。
これは、アコーディオンに関連しない他のすべての CSS の問題である可能性があることを理解するようになりました。何が問題なのかわからないので、CSS 全体 (アコーディオン CSS とほぼ同じ長さ) をアップロードします...もちろん、それで問題ない場合。