• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Liutauras Vilda
  • Jeanne Boyarsky
  • Devaka Cooray
  • Paul Clapham
Sheriffs:
  • Tim Cooke
  • Knute Snortum
  • Bear Bibeault
Saloon Keepers:
  • Ron McLeod
  • Tim Moores
  • Stephan van Hulst
  • Piet Souris
  • Ganesh Patekar
Bartenders:
  • Frits Walraven
  • Carey Brown
  • Tim Holloway

Issues with image slider done using plain jQuery

 
Ranch Hand
Posts: 254
1
MySQL Database Ubuntu Java
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I'm right now implementing an image slider using just jQuery (no plugins that is) for some reason and I'm stuck on some things.

At the moment I have 6 static images that I have wrapped in a div (having overflow property of CSS as hidden and having fixed width) that I'm shifting using .

The logic I'm applying is to subtract the needed left property on the aforementioned div on the click of right arrow and vice versa for the left click(add those quantities to he left property).

The problem,

1) On click, the image which was shifted crosses to the left and shows up and is visible. The new image that landed just now in the div remains invisible. What happens here and how can I display just the relevant image in the div?

2) How would I handle the case where the last image is reached on the right button click? And similarly for left button click event on first image.

I'm new to the front-end so any help/feedback will be appreciated. Here is the code:

HTML


CSS


jQuery

 
Don't get me started about those stupid light bulbs.
  • Post Reply Bookmark Topic Watch Topic
  • New Topic
Boost this thread!