猿问

Javascript 上的图库显示

我在显示图片库时遇到了一些问题,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">&nbsp;

         <img src="components/img/001.png" alt="landing_page_one"></div>

      <div class="circle">


米琪卡哇伊
浏览 113回答 1
1回答
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答