Would anyone mind helping me create a lightweight content slider from scratch? I can’t find one that fits what I need it to do.
Basically I want it to just show 3 articles and slide to the next set. Soo, if I have 7 content blocks, it should do this:
3 blocks -> (slide) -> 3 blocks -> (slide) -> last block
Most content sliders will do this:
3 blocks -> (slide) -> 3 blocks -> (slide) -> last block + first 2 blocks
So it slides 3 blocks twice and adds two of the beginning blocks on the last one. This is not ideal nor what I’d like. It’s been quite frustrating that I can’t seem to find one that doesn’t do what I explained in the second example.
I took the liberty to upload the content to CodePen in case anyone would like to help. I also renamed the title.
@CrocoDillon Sorry to bother you again, is there any way to stop the blocks from shifting when resizing the browser?
Click the right arrow once until you get to the numbers 4, 3 and 2. Now, resize the browser and you will see 4 leaves the area while 1 slips in.
@CrocoDillon Perhaps all three widths (320px * 3 = 960) and a margin of the arrow (320px * 3 + 25px = 985px)? Although, I’m not seeing anything rendering 985px. I wonder if wrapping it in another div might help.
Update: I don’t want to jump the gun here but using percentages rather than pixels is working when I hard code it into Web Inspector.
But it seems to work on localhost perfectly so maybe it was because I didn’t declare it in CodePen?
You must be logged in to reply to this topic.