Need both span.class and p to expand on toggle

故事扮演 提交于 2021-02-17 06:06:33

问题


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

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!