2012-01-19 3 views
1

Так что я использую lightbox (это в основном fancybox), и я использую встроенную функцию (так что ссылка нажата, и появляется какой-то текст).Как скрыть #id объект

я определяю текст как:

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

но проблема заключается в том, что текст отображается на нижней части страницы.

Как это исправить?

+1

Не совсем уверен, что вы просите, но вы просто хотите добавить 'display: none' в CSS? –

ответ

0

скрыть объект с помощью 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'); 

}); 
0

ли вы имели в виду:

 

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

попробовать это: в вашем 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(); 

    }); 
});