如何隱藏#id對象

Question

所以我使用燈箱（它基本上是fancybox），並且我使用了內聯功能（因此點擊鏈接並彈出一些文本）。

我定義的文本如下：

<p id="wald" style="width:500px; border:2px solid #ececec; padding:10px; margin-right:auto;margin-left:auto;"> 
<strong>id="loremipsum"</strong> Nullam varius congue fringilla. Curabitur auctor dapibus molestie. Cras malesuada vestibulum lectus, vel ullamcorper nibh tempus lobortis. Donec ipsum magna, malesuada et fringilla eget, placerat ut arcu. Donec aliquet, mauris ut pellentesque tincidunt, massa dolor tempor urna, ac interdum massa nisl id tellus. Maecenas eu nunc varius lorem porttitor faucibus. Suspendisse potenti. Donec ullamcorper vehicula pretium. In aliquam adipiscing mi, rhoncus eleifend felis auctor eu. Aenean et mi vitae ante ultricies pulvinar a vel neque. 
</p> 

但問題是，文本顯示了在頁面的底部。

我該如何解決這個問題？

Answer 1

隱藏一個對象使用CSS你寫

.[class of element] {display:none; } 

#[id of element] {display:none;} 

你也可以使用{visibility:hidden}

使用jQuery你可以用

$(document).ready(function() { 

    //this is used it we want to access multiple style add extra with comma sperated values. 
    $("#[id of element]").css({display:none}); 
    $(".[class of element]").css({display:none}); 

做到這一點

或者您也可以嘗試

//this is used it we want to access only one style 
    $("#[id of element]").css('display','none'); 
    $(".[class of element]").css('display','none'); 

}); 

Answer 2

你的意思是：

 

//add display:none, so that its hidden and opens in fancybox when clicked if you have valid code 
<p id="wald" style="width:500px; border:2px solid #ececec; padding:10px; margin-right:auto;margin-left:auto; display:none;"> 
//OR 
<div style="display:none;"> 
<p id="wald" style="width:500px; border:2px solid #ececec; padding:10px; margin-right:auto;margin-left:auto;"> 
</div> 
 

Answer 3

試試這個： 在您的HTML：

<a href="#" id="show_dialog">click this to show dialog</a> 

    <p id="wald" style="width:500px; border:2px solid #ececec; padding:10px; margin-right:auto;margin-left:auto;"> 
<strong>id="loremipsum"</strong> Nullam varius congue fringilla. Curabitur auctor dapibus molestie. Cras malesuada vestibulum lectus, vel ullamcorper nibh tempus lobortis. Donec ipsum magna, malesuada et fringilla eget, placerat ut arcu. Donec aliquet, mauris ut pellentesque tincidunt, massa dolor tempor urna, ac interdum massa nisl id tellus. Maecenas eu nunc varius lorem porttitor faucibus. Suspendisse potenti. Donec ullamcorper vehicula pretium. In aliquam adipiscing mi, rhoncus eleifend felis auctor eu. Aenean et mi vitae ante ultricies pulvinar a vel neque. 
</p> 

然後在你的.js代碼鍵入此。 （你需要jquery做到這一點）

$(document).ready(function(){ 
    $('#wald').hide(); 
    $('#show_dialog').click(function(){ 
      $('#wald').show(); 

    }); 
});