- This topic is empty.
August 10, 2015 at 9:32 am #206348
please help me to fix this weird issue. please visit my demo page:
I worked around a circle slider give a new look as I did at my link.
I have an issue related to overflow hidden in webkit browsers-chrome/safari.
I’m able to click only on Central, trending, deals, TV Shows. but not the others properly due to overflow of image slides.
YadiAugust 10, 2015 at 10:10 am #206351
thanks for reply. but now you can see that image links are not working due to low z-index than parent element.August 10, 2015 at 10:39 am #206353
please check now.
if I use low z-index for .viewport, all circular link works, but images href doesn’t. because this way outer circle has higer z-index.August 10, 2015 at 11:01 am #206356
No, its not working.please try to make z-index like 1000, then image links will not work. images are pointing to another link.August 10, 2015 at 11:12 am #206358
how t I edit and share your codepen with you?August 10, 2015 at 11:21 am #206360
I added links to image, and increased z-index. Now you can see the issue while you try to click on CHANNELS, slider will not work due to overflow of inner image circle.August 10, 2015 at 11:35 am #206362
let me know you that actual working:
slider outer circle links are set to change image slide.
but an image links to open a new page/alert.
Now, I set .viewport z-index to 0. image links are working fine this way. but not able to change slides by clicking CHANNELS on outer circle due to overflow of viewport.
you got my point now?August 10, 2015 at 2:09 pm #206367
I notice it as well (Windows 7) but I think you could solve it by adding
pointer-events: noneto the unsorted list.
Edit – sorry, never mind that since you’d need them for the link…August 10, 2015 at 4:44 pm #206374
Misfire again… it’s pretty odd.
The trouble starts at the list item,
.viewportitself is not ‘leaking’ pointer events outside the border-radius.August 10, 2015 at 7:35 pm #206381
still not found any fix for this. I wasted my last full day on this. please find something solid and tricky to fix this.
I think it is working fine for MAC users @Atelierbram, but not for windows users and even its not working on iphones.August 10, 2015 at 9:19 pm #206382
Changing the following will make it work as expected :
border-radius: 50%to li and img
display: blockfrom img
I think it’s a remnant of a long lasting bug…August 10, 2015 at 9:39 pm #206383
mind-blowing! you saved my day. It works fine for me.
thanks a lot.August 10, 2015 at 10:45 pm #206386
No problem, it was too tempting to not give up on it. Such a neat design doesn’t deserve a browser glitch. Very nice work.August 11, 2015 at 5:44 pm #206411
I wouldn’t recommend anyone to add a slider to their page but I’ll make an exception for this one.
- The forum ‘CSS’ is closed to new topics and replies.