【问题标题】:slideshow and the navigation bar used here.... https://www.imaginedragonsmusic.com幻灯片和此处使用的导航栏.... https://www.imaginedragonsmusic.com
【发布时间】:2017-10-30 02:16:27
【问题描述】:

谁能帮我制作这里使用的幻灯片导航栏.... https://www.imaginedragonsmusic.com

我遇到的问题..

  • 我尝试了轮播类,使用引导程序,但是当图像在轮播指示器中处于活动状态时,我无法添加褪色效果和金色背景效果。
  • 调整浏览器大小时,我无法像原来的网站那样出现效果。

谢谢

【问题讨论】:

  • 先生,我能问你一件事吗?你知道如何使用 HTML、CSS、JS 吗?
  • 先生,我只是在学习。我很抱歉成为那些想要一夜之间学习重要事物而不是努力工作并自己学习的人之一。我知道我要的东西非常简单。我已经创建了副本,现在我正在添加更多细节。但我希望我的复制网站如此完美......所以请你帮帮我,先生。
  • 如果你愿意,我可以邮寄我创建的项目。
  • 我或任何人如何仅通过指向另一个网站的链接来帮助您。至少尝试接近您想要的结果,向我们展示一些代码,这里的每个人都会很乐意为您提供帮助。
  • 不需要给我发电子邮件。提出一个新问题,并添加一些相关代码以补充您的问题。

标签: javascript jquery css


【解决方案1】:

我的做法如下:

<span>Left Arrow</span>

    <div> First Image <div>
    <div> Second Image <div>
    <div> Third Image <div>
    <div> Fourth Image <div>

<span>Right Arrow</span>

(1) 隐藏除第一张以外的所有图片

(2) 然后在两个箭头上设置点击事件

(3) 假设点击了右箭头,它应该显示第二张图像并隐藏其余图像

(4) 如果再次点击,它应该显示第三张图像并隐藏其余图像,等等

(5) 为左箭头设置相同的东西

我之前用 Vanilla JS 做过这个,你可以在这里找到代码: https://github.com/nishkaush/automatic-slideshow

我这样做是为了让图像每隔几秒钟更改一次,但用户也可以通过单击前进或后退箭头来更改它们。

希望这会有所帮助!

【讨论】:

  • 非常感谢,我修改了我的代码。这对我帮助很大。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-02-24
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多