第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全，請及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題，去搜搜看，總會有你想問的

崩潰時(shí) bootstrap js 轉(zhuǎn)換

崩潰時(shí) bootstrap js 轉(zhuǎn)換

慕村225694 2023-09-07 16:30:13
我正在尋找一個(gè)切換折疊按鈕，我被引導(dǎo)到這個(gè)鏈接： https: //getbootstrap.com/docs/4.0/components/collapse/ 我找到了我正在尋找的東西，但唯一的問題是過渡; 一旦我點(diǎn)擊按鈕，它就會立即顯示我的 div 。我希望它隨著過渡而擴(kuò)展得更慢。這是我的代碼：.innerdiv{    display: block;    width: 33%;    padding: 50px;    margin-left: 2px;    text-align: center;    background-color: #2bb88d;    margin-top: 20px;    border-radius: 20px;    height: 350px;    overflow:auto ;    float: left;    clear: right;    transition: 15s;}<!DOCTYPE html><html>  <head>      <meta charset="UTF-8">      <meta name="viewport" content="width=device-width, initial-scale=1.0">      <title>Document</title>      <link rel="stylesheet" href="styletest.css">      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">      <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>      <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>  </head>  <body>    <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> more adresses </button>    <div class="collapse" id="collapseExample">      <div class="innerdiv"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Blanditiis est soluta aliquam necessitatibus quia tempora corrupti hic fuga! Perspiciatis iste vero ipsum maxime, saepe vitae dolores amet iure assumenda cum.</p></div>    </div>  </body></html>
查看完整描述

1 回答

?
慕標(biāo)5832272

TA貢獻(xiàn)1966條經(jīng)驗(yàn) 獲得超4個(gè)贊

崩潰時(shí)，會運(yùn)行一個(gè)名為 的默認(rèn)引導(dǎo)類collapsing。你必須像這樣重寫該類：


<!DOCTYPE html>

<html>


<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">

    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>


</head>


<style>

    .innerdiv {

        display: block;

        width: 33%;

        padding: 50px;

        margin-left: 2px;

        text-align: center;

        background-color: #2bb88d;

        margin-top: 20px;

        border-radius: 20px;

        height: 350px;

        overflow: auto;

        float: left;

        clear: right;

    }

    

    .collapsing {

        transition: 15s;

    }

</style>


<body>

    <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample"> more adresses </button>

    <div class="collapse" id="collapseExample">

        <div class="innerdiv">

            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Blanditiis est soluta aliquam necessitatibus quia tempora corrupti hic fuga! Perspiciatis iste vero ipsum maxime, saepe vitae dolores amet iure assumenda cum.</p>

        </div>

        <div class="innerdiv">Lorem ipsum dolor sit amet consectetur adipisicing elit. Suscipit explicabo, expedita voluptate nemo commodi architecto qui libero aliquam nisi corrupti quam, dignissimos odit hic neque aperiam, repudiandae ex soluta. Iste assumenda nostrum culpa

            architecto fugit id laborum quidem expedita perferendis aliquam placeat distinctio, ad magni ipsam tenetur est nesciunt non pariatur esse veritatis dolores dolorem unde quos ducimus? Beatae quam, corporis hic autem quisquam quae magni totam

            vitae labore sapiente error ab quo animi consequuntur veniam tempore facere. Facilis, minima quo neque a quas numquam magni, laborum dignissimos accusamus ipsa facere fuga. Quam voluptate sit quas illo sequi, sed nam vero repellendus, ipsum,

            officia quibusdam quos consectetur voluptas dignissimos obcaecati ad non natus hic recusandae quae numquam ex. Aspernatur esse unde, expedita nisi amet laborum blanditiis accusamus corrupti ea vel! Exercitationem vel, quidem in sed dolorem

            ullam odit sit nisi earum nesciunt unde eaque cum labore, quam id quibusdam ab.</div>

        <div class="innerdiv">Lorem ipsum dolor sit amet consectetur adipisicing elit. Suscipit explicabo, expedita voluptate nemo commodi architecto qui libero aliquam nisi corrupti quam, dignissimos odit hic neque aperiam, repudiandae ex soluta. Iste assumenda nostrum culpa

            architecto fugit id laborum quidem expedita perferendis aliquam placeat distinctio, ad magni ipsam tenetur est nesciunt non pariatur esse veritatis dolores dolorem unde quos ducimus? Beatae quam, corporis hic autem quisquam quae magni totam

            vitae labore sapiente error ab quo animi consequuntur veniam tempore facere. Facilis, minima quo neque a quas numquam magni, laborum dignissimos accusamus ipsa facere fuga. Quam voluptate sit quas illo sequi, sed nam vero repellendus, ipsum,

            officia quibusdam quos consectetur voluptas dignissimos obcaecati ad non natus hic recusandae quae numquam ex. Aspernatur esse unde, expedita nisi amet laborum blanditiis accusamus corrupti ea vel! Exercitationem vel, quidem in sed dolorem

            ullam odit sit nisi earum nesciunt unde eaque cum labore, quam id quibusdam ab.</div>

    </div>

</body>


</html>


查看完整回答
反對 回復(fù) 2023-09-07
  • 1 回答
  • 0 關(guān)注
  • 105 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

 幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

 公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號