JS Prev/Next Not Working....Maybe Conflict with Other JS?

Hello,

The prev/next button for the iPhone prototype under my Portfolio section isn't working properly in Chrome and Firefox. It jumps a bit when you click on prev/next. It isn't working at all in Safari. In Safari, when you click on prev/next, it works once or twice and it stops working. Can anyone help?

Here is my site: http://lucychen.me/index2.html

Greatly appreciated!
Nana00Asked:
Who is Participating?
 
GaryConnect With a Mentor Commented:
Is this your own jQuery? It's like following breadcrumbs trying to debug.
I suggest you cut all the code down to this logic.
Put all the images in the iphone container with a class that only shows the first image.
Add a class to the prev and next spans instead of trying to find them.
Onclick of prev you move the image to the end of your stacked images and on click of next you move the last image to the beginning.
It's about 4 lines of code and will be easier to debug if it still isn't working.
0
 
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
Try changing the css for compenent.css line 56 to

.ac-device a {
height: 440px;
width: 249px;
display: block;
position: relative;
overflow: hidden;
margin: 85px 0 0 20px;
padding-top: 85px;
}

Open in new window

0
 
Nana00Author Commented:
I made that change locally and it still doesn't work in Safari.
0
 
Scott Fell, EE MVEConnect With a Mentor Developer & EE ModeratorCommented:
Part of the problem is your site is responsive but you have the images set to absolute position.  As the screen changes sizes, the screen capture images will not match up with the background.  They at least need to be relative to the parent.
0
 
Nana00Author Commented:
Thank you for the great suggestions! I figured out a work around but do appreciate your help!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.