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

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

彈出模態(tài)并跳轉(zhuǎn)到內(nèi)部錨點(diǎn)

彈出模態(tài)并跳轉(zhuǎn)到內(nèi)部錨點(diǎn)

侃侃爾雅 2021-11-18 19:59:51
我正在嘗試創(chuàng)建一個鏈接,單擊該鏈接時會彈出一個模式,并跳轉(zhuǎn)到其中的一個錨點(diǎn)。目前您會看到我有一些彈出窗口的代碼(為一組嵌套模式配置),因此它不是標(biāo)準(zhǔn)設(shè)置。當(dāng)您單擊鏈接兩次時,它們會起作用。我怎樣才能讓它按原樣工作,只需單擊一下。這是一個小提琴      //popup nested modals      $(function () {    const openModals = [];    $('.element-item').click(e => {      e.preventDefault();      $(e.currentTarget).closest('.modal').add('body').addClass('open');      openModals.push($($(e.currentTarget).attr('href')).show());    });    $(window).add('.close').click(e => {      e.stopPropagation();      if ($(e.target).is('.modal, .close')) {        const closing = openModals.pop().addClass('modal-content-active');        setTimeout(() => {closing.hide().removeClass('modal-content-active')}, 0);        if (openModals.length > 0) {          openModals[openModals.length - 1].removeClass('open');        } else $('body').removeClass('open');      }    });  });   //jump to anchor in modal    $('.item1').on('click',function(){ $('#contributors').animate( { scrollTop: $('#item1').offset().top -40 }, 500); });  $('.item2').on('click',function(){ $('#contributors').animate( { scrollTop: $('#item2').offset().top -40 }, 500); });.modal{    width: 300px;    height: 200px;    overflow: auto;   display: none;}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><a href="#contributors" class="element-item item1">item1</a>    <a href="#contributors" class="element-item item2">item2</a>          <!-- The Modal -->  <div id="contributors" class="modal">        <header><span class="close">×</span></header>   line<br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line      <div class="item" id="item1"><h4>Item 1</h4></div><br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line<div class="item" id="item2"><h4>Item 2</h4></div><br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line<br>line  </div>
查看完整描述

1 回答

?
qq_笑_17

TA貢獻(xiàn)1818條經(jīng)驗(yàn) 獲得超7個贊

問題是只有在兩個點(diǎn)擊處理程序都完成后布局才會更新。一個快速的解決方法是用以下方法包裝處理程序requestAnimationFrame:


$('.item1').on('click',function(){ requestAnimationFrame(() => 

    $('#contributors').animate( { scrollTop: $('#item1').offset().top -40 }, 500)

)});

https://jsfiddle.net/onbmh7ur/


查看完整回答
反對 回復(fù) 2021-11-18
  • 1 回答
  • 0 關(guān)注
  • 121 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

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

公眾號

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