テーブルの上にdivを表示させるにはどうすればいいですか?テーブルの行は展開されません。divを他のテーブル行の上にオーバーレイするにはどうすればよいですか?
「.property_menu_link」アンカータグのいずれかをクリックしてメニューを展開すると、行全体が展開されます。私は、テーブルを拡張するのではなく、TRの上にメニューをオーバーレイしたいが、これが起こるのを苦労している。
私は間違っていますか? HTML:
<table>
<tr>
<td valign="top" align="left">
<div class="property_menu_container">
<div style="display: none;" class="property_links_box ui-corner-all">
<ul class="basic">
<li>
<a onclick="open_me()" >Property Details</a>
</li>
<li>
<a onclick="open_me()" >Units, Leases & Occupants</a>
</li>
</ul>
</div>
<div class="property_menu_link">
<a>
<img src="images/maximize.png" id="68_p_img_folder">
</a>
</div>
</div>
<span class="page_name property_name_span">Property Name 1 Here</span>
</td>
</tr>
<tr>
<td valign="top" align="left">
<div class="property_menu_container">
<div style="display: none;" class="property_links_box ui-corner-all">
<ul class="basic">
<li>
<a onclick="open_me()" >Property Details</a>
</li>
<li>
<a onclick="open_me()" >Units, Leases & Occupants</a>
</li>
</ul>
</div>
<div class="property_menu_link">
<a>
<img src="images/maximize.png" id="68_p_img_folder">
</a>
</div>
</div>
<span class="page_name property_name_span">Property Name 2 Here</span>
</td>
</tr>
</table>
CSS:
/******************************
Property Menu dropdown
******************************/
.property_menu_container {
width: 200px;
/*height: 300px; --> this causes the row height for properties to be 300px before it's expanded*/
position: relative;
}
.property_name_span{position: absolute; left:40px;}
.property_links_box {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 15px;
padding:10px;
border: 3px solid #000000;
background-color: #FFFFFF;
filter:alpha(opacity=75);
opacity:.75;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)"; /*--IE 8 Transparency--*/
}
.property_menu_link {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.property_links_box{
z-index: 10;
}
/******************************
END Property Menu dropdown
******************************/
はjavascript:
$(document).ready(function(){
$("div.property_menu_link a").toggle(function(){
//1st Click
$(this).parent().siblings(\'.property_links_box\').show();
$(this).parent().parent(\'.property_menu_container\').css("height", "300px");
}, function() {
//2nd click
$(this).parent().siblings(\'.property_links_box\').hide();
$(this).parent().parent(\'.property_menu_container\').css("height", "1px")
});
});
TomalakGeret'kal @からの質問にスラッシュについてのコメントを見ますが、これは十分に問題として単離されていません。また、Javascriptにランダムなバックスラッシュがありますが、私はそこにいるはずはないと確信しています! –
私はそれを更新しました...バックスラッシュはPHP用です...私はPHPスクリプト内でこの特定のjavascriptを生成します。書き出されるとバックスラッシュはそこにありません。 – Ronedog