menu similar like the sun

@suatsuphiOct 11.2020

Hi,
there is a carousel menu on website of the sun co uk
I wanna use this menu. it seems carousel. there is a firstly right button. if you click it, The Left Button appears.

I need this example.

to post a comment

HTML

@JMRKEROct 11.2020 — #Where is your example located?

@VITSUSAOct 12.2020 — #Can you please share the reference link with us?

@SempervivumOct 12.2020 — #I guess the TO means thesun.co.uk.

Such carousel can be made by the cycle2 plugin:

http://jquery.malsup.com/cycle2/demo/carousel.php

Scroll down to "Non Circular". You can easily omit the pager and place the controls where you like.

@HarshShahOct 19.2020 — #@suatsuphi#1624127

Try this...

HTML

``<i>
 </i>&lt;div class='container'&gt;
 &lt;div class='item'&gt;
 &lt;div&gt;&lt;h3&gt;1&lt;/h3&gt;&lt;/div&gt;
 &lt;div&gt;&lt;h3&gt;2&lt;/h3&gt;&lt;/div&gt;
 &lt;div&gt;&lt;h3&gt;3&lt;/h3&gt;&lt;/div&gt;
 &lt;div&gt;&lt;h3&gt;4&lt;/h3&gt;&lt;/div&gt;
 &lt;div&gt;&lt;h3&gt;5&lt;/h3&gt;&lt;/div&gt;
 &lt;div&gt;&lt;h3&gt;6&lt;/h3&gt;&lt;/div&gt;
 &lt;/div&gt;
 &lt;/div&gt;<i>
 </i>`</CODE>
 
 CSS
 <CODE>`<i>
 </i>.container {
 margin: 0 auto;
 padding: 40px;
 width: 80%;
 color: #333;
 background: #419be0;
 }
 
 .slick-slide {
 text-align: center;
 color: #419be0;
 background: white;
 }<i>
 </i>`</CODE>
 
 JS
 <CODE>`<i>
 </i>$(".item").slick({
 dots: true,
 infinite: true,
 slidesToShow: 3,
 slidesToScroll: 3,
 cssEase: "ease",
 autoplay: true,
 autoplaySpeed: 3000,
 });<i>
 </i>``

menu similar like the sun

4 Comments(s) _↴

Also in #HTML _↴

Success!

Social

Version

menu similar like the sun

4 Comments(s) ↴

Also in #HTML ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

4 Comments(s) _↴

Also in #HTML _↴