I have a slider which is also acting as a navigation on a the ‘People’ section. When the slide enters the mask it displays a div and hides when leaves the mask.
I have a couple of snags which I am struggling to resolve, Screen clip
1 - Function
I would like the slider to appear infinite, currently there is a gap once you scroll to the last slide beginning / end
2 - Interaction
Would it be possible for the user to select / click one of the slides to activate rather than only using the arrows?
3 - Design
Currently the slide arrows crop over the slides at the ends. Ideally i could add a div which is smaller than the slider which would allow the slides to be hidden before the slide buttons but it is not possible to add a div within the slider / mask.
The only way to do it would be style arrow links the way that it would completely cover the area at the each end of the slider (make bigger size and set background color) and ICON inside that links style the way you have those links styled now (round+border)
I will take a look at @PixelGeek workshop and hopefully all will be revealed.
This is a real shame. We had some UAT and every test came back with the same request, I think the design leads the user to think this is a function.
I think I understand, I guess this is a workaround but the only issue is the main bkg is a gradient from left to right so if I make the arrow link bkg a solid colour I think the edges would be visible?
Also - would this also fall down with different window sizes / resolutions?
I finally got round to viewing @PixelGeek tutorial that you recommended regarding the gap at each end of my slider. However I don’t think this works for my set up / function as each slide has a IX2 to display / hide content - view here .
Unless I have misunderstood, any other ideas / solutions?
Just as a reminder, this is the issue I issue I am trying to resolve, this is how the slider nav currently displays when you get to the end of the slides…
, slides works fine on my end 
