我在顯示圖片庫時遇到了一些問題,demo-wrapper我希望可以并排顯示圖像(水平),并且能夠在沒有按鈕的情況下在它們之間滑動。我無法使用 flex 完成此操作,因此現在我嘗試使用 javascript 來完成此操作。目前我的參考腳本有一個基于箭頭的按鈕來改變圖像之間的,但遺憾的是我無法控制圖像并且我找不到我的錯誤。我希望就如何使用下面的腳本完成此操作或替代方法提供建議。HTML: <!DOCTYPE html> <html> <meta charset="UTF-8"> <head> <a name="top"></a> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>スタジオ</title> <link rel="stylesheet" type="text/css" href="style.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <script> $(document).ready(function() { Slider = $('#slider').Swipe({ auto: 3000, continuous: true }).data('swipe'); $('.next').on('click', Slider.next); $('.prev').on('click', Slider.prev); }); </script> </head> <body> <div class="banner">スタジオ</div> <div class="header">NAME<br>LASTNAME.</div> <div class="pofabut">About</div> <div class="contact-social"> <div class='github'> <a href="https://github.com/user" alt="github" target="_blank"> <img width="19px" src="components/img/github.svg"/> </a> </div> <div class='instagram'> <a href="https://www.instagram.com/user" alt="instagram" target="_blank"> <img width="20" src="components/img/instagram.png"/> </a> </div> <div class='email'> <a href="mailto:email" alt="email" target="_blank"> <img width="25px" src="components/img/email.png"/> </a> </div> <div class='linkedin'> <a href="" alt="linkedin-user" target="_blank"> <img width="20px" src="components/img/linkedin.svg"/> </a> </div> </div> <div class="image-one"> <img src="components/img/001.png" alt="landing_page_one"></div> <div class="circle">
Javascript 上的圖庫顯示
米琪卡哇伊
2021-10-29 10:12:27