问题
I have a portfolio webpage, where I need describtions and and "Image"-tag to show, when the projects are clicked. For this I am using toggle, javascript.
I currently have this piece of code, where I want the span.class and the paragraph to both expand when the project is clicked. Otherwise I wish that both elements remain hidden on the page. Right now I cannot make span.class hide before toggle, and so only the paragraph show on toggle, which causes the whole thing to look wierd. This is the code I am using.
$(document).ready(function(){
$(".li_element").each(function(index) {
$(this).find('p','span.PopUp').first().hide();
});
$("li").click(function(){
$(this).find('p','span.PopUp').first().toggle();
$(this).toggleClass("expand");
});
});
<li class="Project" data-modal="myModal_1">
<span id="myBtn_1">
Lirma Type
</span>
<span id="year">
2019
</span>
<div class="Describtion">
<span class="PopUp" >Images</id>
<p style="display:none;">
Typedesign
</p>
</div>
<div id="myModal_1" class="modal" >
<div class="modal-content">
<div id="demo" class="carousel slide" data-ride="carousel">
<!-- The slideshow -->
<div class="carousel-inner">
<div class="carousel-item active">
<img src="Images/Lirma/type.jpg" alt="img" width="100%">
</div>
</div>
<p>Type design</p>
</div>
</div>
</div>
</li>
回答1:
Just one string:
$(this).find('p,span.PopUp').first().hide();
or maybe you want
$(this).find('p').first().hide();
$(this).find('span.PopUp').first().hide();
来源:https://stackoverflow.com/questions/60455586/need-both-span-class-and-p-to-expand-on-toggle