News Articles slider

dashed line in between slick dots of slick slider

I want to create dashed line between slick dots of slick slider . I have uploaded image for it . How can I achieved this ?enter image description here Source: CSS – Stack Overflow

How to delay transition in controlled Swiper instance when using the Controller module?

I have a set of two Swiper instances that are synced together in a React component. A "main" slider controls a "secondary" instance. When it transitions to another slide, the secondary instance does the same in real time. What I’m trying to achieve is to set a delay after which the sync would occur. For […]

Slider to display 3 objects from the backend

I’ve recently started learning Angular and I’m wondering to do a certain thing. My plan is to display 3 products fetched from the backend on the page. The main problem is getting the animation to work. The animation would be based on the slider principle. If I click the "right" button current displayed objects should […]

how can i show picture and video in slider properly in HTML?

i just use w3 slider for my modal pop up But when my images or videos fetch from Api insteed of show in a container, it shows in block and Next / Previous button didn’t work ! this is my modal that going to pop up when user click on a division: <!– Modal content […]

How to render images with React JS using map function? this code just render first slide not all slides

When I run the code, it only shows the first slide, but does not show the rest of slides, in this codes I want to use map function for render image slides and I use Arrow Icon for switch between slides, this code displays just the first slide and other is empty, why? This is […]

JS slider. Sliding in the direction of the pressed arrow

Backstory: I wanted to make a slider for my website, so I made another "subpage" just to make things easier to work out (it’s just a prototype, so CSS is just the basic styling – if the user clicks the arrow, a slide will slide in that direction, so e.g. if the user pressed the […]

How to smoothly slide three div in a row

I want to slide three div in a row! The effect must be smooth. There will have two button for slide with id (#left & #right. When I click the #left button div must slide to left and the same for #right. After sliding the last of three div it will start from 1st div […]

Image Comparison Slider – how to make it scalable?

I’m trying to make a simple image comparison slider box (based on THIS tutorial) but I would like it to scale entirely with the size of the page. I managed to change it that the main div window* and background** (right, after image) are scaling but I used tricks which won’t work on the image […]

Display issues with multiple React Carousel libraries

I am currently trying to implement some Carousel libraries into my react app but I am coming across an issue with all the ones I’ve tried. The Carousels would display the items on the first slide, but then it wouldn’t display any other items on the other slides, even if they exist within the carousel […]

Jquery slider no way go back or change to next slider

Here is the code from jqueryscript. i cant modify this, if anyone can help me, when u click on slider its open full width, then no way go back or change to next slider, wants to change slider or go back to the start position after another click or so. so i wants to make […]

Slider with sticky texts and buttons

I have a question about a slider that I need to make with Bootstrap 3.3.1. I would like to make an image slider with texts and 3 buttons hovering and centered over those images. So far so good, the tricky part is that I would like the text and buttons to remain still as the […]

Content not changing when clicking an item from a slider (javascript and php)

I have created a slider for a sub nav mobile version. If you click on an item from this slider, the content below should change. I just had to code the javascript for the slider and the backend developer had to connect it with the content. Desktop is working but mobile is not working (content […]

WordPress (ColorMag theme free) Sliders carousel: controls/arrows and indicators

I am editing ColorMag free theme on WordPress for my own blog.For the slider in the homepage TG: Featured Category Slider for the free version I want a help how to made it with arrows/controls (previous and next) and also with indicators (in the bottom of the sliders) showing them responsive in mobile and desktop […]

Trouble finding what kind of slider this is

I’m having trouble getting code samples for a particular slider I saw on znap link site ([example][1] [1]: https://znap.link/thechrisdo I probably can’t get it because I don’t know what it’s called would really appreciate if I could get the name or code… Source: CSS – Stack Overflow

How can i make images slider repeating as an infinity loop or Marquee using CSS

Because < marquee> tag became deprecated, I tried changing my slider to do the same function but using CSS. This is my css code: <style> .marquee{ width: 80%; overflow: hidden; border:1px solid #ccc; } .brandSlider{ display: flex; list-style: none; animation: scrollingSlider 20s linear infinite; } .barndSliderItem{ height: 250px; width: 250px; margin-left: 10px; } .brandSliderContainer{ width: […]

coreui-vue – Vue Carousel not runs automatically?

I have used coreui-vue for the project, but the problem is with the carousel, a carousel isn’t started on page mount, interesting interval slide run’s when I resize screen size from inspecting elements, what is the problem? Page: <template> <CCarousel v-if="isLoaded" :interval="4000" transition="crossfade"> <CCarouselItem :interval="4000"> <img class="d-block w-100" src="https://coreui.io/vue/docs/4.0/images/vue.jpg" alt="slide 1" /> </CCarouselItem> <CCarouselItem :interval="4000"> […]

Two Manual Slider in HTML

I am currently trying to add two(2) manual slider with a small dots that user can click to switch image. The left and right arrow seems to work but the small dots did not. The left and right will move to the next or the previous image in the slider. The number of small dots […]

How to get dynamic steps and dependencies in React input type range (slider)?

I need to have two input-sliders of range type. The first one should have: min value = 1000, max value 20000, and step = 1000. It’s the easy one. I have it done. The second one should have: min value = 3, max value = 70, and dynamic step [3, 7, 14, 54, 70]. How […]

Sitemap | Terms | Privacy | Cookies | Advertising

Senior Software Developer

Creator of @LzoMedia I am a backend software developer based in London who likes beautiful code and has an adherence to standards & love's open-source.