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

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

單擊鏈接并重定向到該內(nèi)容

單擊鏈接并重定向到該內(nèi)容

慕碼人2483693 2023-01-06 15:22:10
我正在嘗試創(chuàng)建一個功能,其中頂部將有多個鏈接,并且默認(rèn)情況下將在同一頁面中加載內(nèi)容和標(biāo)題。鏈接和標(biāo)題將相關(guān),因此單擊鏈接將重定向到具有效果的特定 div(類似于單頁應(yīng)用程序)。例子:Vision Mission Address ContactVisionContent here MissionContent here AddressContent here ContactContent here 我不確定我是怎么做到的,但創(chuàng)建了一個實際上不相似的樣本,可以說是一個試驗。這不是我想要的:$(document).ready(function(){  $(".subcontent").hide();  $('#myMenu').on('click','a',function()  {    $('.subcontent:visible').hide();    $('.subcontent[id='+$(this).attr('data-id')+']').fadeIn();  });});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script><ul id="myMenu">  <li><a href="#" data-id="Vision">Vision</a></li>  <li><a href="#" data-id="Mission">Mission</a></li></ul><section class="subcontent"  id="Vision" style="display:block" >  <div class="page-heading">     <h1 class="caption">Vision</h1>  </div></section><section class="subcontent"  id="Mission" >  <div class="page-heading">     <h1 class="caption">Mission</h1>  </div></section>
查看完整描述

1 回答

?
江戶川亂折騰

TA貢獻(xiàn)1851條經(jīng)驗 獲得超5個贊

希望下面的片段能幫到你


$(document).ready(function () {

  $('.top').click(function() {

  $('html, body').animate({

    scrollTop: $(".top-section").offset().top

  }, 1000)

}), 

  $('.middle').click(function (){

    $('html, body').animate({

      scrollTop: $(".middle-section").offset().top

    }, 1000)

  }),

  $('.bottom').click(function (){

    $('html, body').animate({

      scrollTop: $(".bottom-section").offset().top

    }, 1000)

  })

  

 $('.top-section').click(function (){

    $('html, body').animate({

      scrollTop: 0

    }, 1000)

  })

 $('.middle-section').click(function (){

    $('html, body').animate({

      scrollTop: 0

    }, 1000)

  })


  $('.bottom-section').click(function (){

    $('html, body').animate({

      scrollTop: 0

    }, 1000)

  })

});

body,

html {

  width: 100%;

  height: 100%;

  margin: 0;

  display: inline;

}


.top-section {

  background-color: green;

  height: 100%;

  width: 100%;

  display: flex;

}


.middle-section {

  background-color: yellow;

  height: 100%;

  width: 100%;

  display: flex;

}


.bottom-section {

  background-color: red;

  height: 100%;

  width: 100%;

  display: flex;

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>

<div>

    <h4>Click on Top,Middle.Bottom will take to the section,Click on Click on section will take to the Top</h4>

    

    <h5 class="top">Top</h5> 

    <h5 class="middle">Middle</h5> 

    <h5 class="bottom">Bottom</h5>

</div>

<div class="top-section">

    <h1>Top Section</h1>

</div>

<div class="middle-section">

    <h1>Middle Section</h1>

</div>

<div class="bottom-section">

    <h1>Bottom Section</h1>

</div>


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

添加回答

舉報

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

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

公眾號

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