如何隐藏#id对象

How to hide #id object

本文关键字：#id 对象 隐藏 何隐藏      更新时间：2023-09-26

所以我使用lightbox（它基本上是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>

但问题是文本显示在页面的底部。

我该怎么解决这个问题？

要使用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');
});

你的意思是：


//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>

试试这个：在您的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();
     });
});
相关文章：