search

creativetimofficial / ct-paper-kit-2-pro

Paper Kit 2 PRO is a premium Bootstrap 4 UI Kit with a huge number of components, sections and example pages.
https://www.creative-tim.com/product/paper-kit-2-pro
21 stars 6 forks source link

Carousel not advancing on tablets #20

Closed ASGrant55 closed 4 years ago

ASGrant55 commented 5 years ago

I'm having a problem with the Carousel slider, where the slides will not advance beyond slider #2. The issue is on tablet devices, such as the iPad.

Development site: http://www.lock.cgiadvertising.com/home-page-test.html

Please view the page on an iPad (not on a desktop browser in "responsive" mode"). The carousel will advance to the second slide, but then stop. Slides 3 and 4 never appear.

There is no problem on desktop or on an iPhone.

Note: This issue is in your demo as well: https://demos.creative-tim.com/paper-kit-2-pro/sections.html

ASGrant55 commented 5 years ago

Please look into this issue for me. I filed this problem last week.

groovemen commented 5 years ago

Hello @ASGrant55,

Thank you for using our products and for the late response, I double checked your project on an iPad device on Safari and Chrome and everything looks good. The slides advance all, over and over again after every 7 seconds. The problem on our website of this product is that the interval that was set for the carousel is 20000 so it's too big to be noticed.

All the best, Stefan

ASGrant55 commented 5 years ago

Hi Stefan. Thank you for your reply.

The issue is related to the iOS environment, so I have a few more questions: Did you view the site on an actual iPad or in emulation mode on a desktop computer? If you viewed it on an actual iPad, what version of the iOS is running on your iPad?

My iPad is on iOS 12.1

On mine, the carousel advances from slide 1 to slide 2, and then stops. But it’s not “sliding”. The transition is an immediate “switch” from 1 to 2. No slide from right to left.

Is there a way to set the slides to fade instead?

I believe this problem is a conflict between iOS and jQuery. If I can determine the code that advances the slides, I might be able to solve the conflict. Is there a way to debug the interaction while the slides are advancing?

Adam CGI Advertising | Coordinated Graphics, Inc.

__ Sent from my iPad

On Nov 15, 2018, at 4:22 AM, Stefan notifications@github.com wrote:

Hello @ASGrant55,

Thank you for using our products and for the late response, I double checked your project on an iPad device on Safari and Chrome and everything looks good. The slides advance all, over and over again after every 7 seconds. The problem on our website of this product is that the interval that was set for the carousel is 20000 so it's too big to be noticed.

All the best, Stefan

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.

groovemen commented 5 years ago

Hello again,

As you asked me, I checked your project on an iPad (v12.1), and everything looks fine; I can make a screen recording if you don't believe me. Being a Bootstrap component, you can find all the settings on their documentation also the Fade effect you can find right here: http://getbootstrap.com/docs/4.1/components/carousel/#crossfade.

Best, Stefan

ASGrant55 commented 5 years ago

I did a screen recording from mine. I’ll send it in a separate email. I’d appreciate if you could do a screen recording too. Thanks!!

Adam CGI Advertising | Coordinated Graphics, Inc. — Sent from my iPhone

On Nov 15, 2018, at 7:06 AM, Stefan notifications@github.com wrote:

Hello again,

As you asked me, I checked your project on an iPad (v12.1), and everything looks fine; I can make a screen recording if you don't believe me. Being a Bootstrap component, you can find all the settings on their documentation also the Fade effect you can find right here: http://getbootstrap.com/docs/4.1/components/carousel/#crossfade.

Best, Stefan

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.

ASGrant55 commented 5 years ago

Video of my iPad screen attached.

Adam CGI Advertising | Coordinated Graphics, Inc. — Sent from my iPhone

On Nov 15, 2018, at 7:49 AM, Adam S. Grant agrant@cgiadvertising.com wrote:

I did a screen recording from mine. I’ll send it in a separate email. I’d appreciate if you could do a screen recording too. Thanks!!

Adam CGI Advertising | Coordinated Graphics, Inc. — Sent from my iPhone

On Nov 15, 2018, at 7:06 AM, Stefan notifications@github.com wrote:

Hello again,

As you asked me, I checked your project on an iPad (v12.1), and everything looks fine; I can make a screen recording if you don't believe me. Being a Bootstrap component, you can find all the settings on their documentation also the Fade effect you can find right here: http://getbootstrap.com/docs/4.1/components/carousel/#crossfade.

Best, Stefan

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.

groovemen commented 5 years ago

Attached you will find the screen recording from our iPad:

carousel.mov.zip

All the best, Stefan

ASGrant55 commented 5 years ago

I'm not sure my screen recording from my iPad went through before so I’m sending it again. Adam

– Coordinated Graphics, Inc. / CGI Advertising (914) 421-1521 • Fax (914) 828-0109 https://www.cgiadvertising.com

This email and any files transmitted with it are confidential and intended solely for the use of the individual or entity to whom they are addressed. If you have received this email in error, please notify the sender immediately by email and delete this communication from your system. If you are not the intended recipient you are notified that disclosing, copying, distributing or taking any action in reliance on the contents of this information is strictly prohibited.

On Nov 15, 2018, at 7:06 AM, Stefan notifications@github.com wrote:

Hello again,

As you asked me, I checked your project on an iPad (v12.1), and everything looks fine; I can make a screen recording if you don't believe me. Being a Bootstrap component, you can find all the settings on their documentation also the Fade effect you can find right here: http://getbootstrap.com/docs/4.1/components/carousel/#crossfade http://getbootstrap.com/docs/4.1/components/carousel/#crossfade.

Best, Stefan

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/creativetimofficial/ct-paper-kit-2-pro/issues/20#issuecomment-439018404, or mute the thread https://github.com/notifications/unsubscribe-auth/AFtGqRjU17ZfMMzZRM3cOgTGRVzQSW61ks5uvVjZgaJpZM4YWjYg.

ASGrant55 commented 5 years ago

I changed the carousel to “carousel-fade” so the slider now works on my iPad. No solution to the regular "slide" effect, however. Which is unfortunate.

groovemen commented 4 years ago

We will fix this issue in the next update. Sorry for this inconvenience.

Cheers, Stefan