Menu icon Foundation

Designer | Oklahoma

My Posts




  • 12
    Replies
  • Orbit Slider acting strange in tablets

    By Ganbaa

    My orbit slider is acting so weird in tablet environment. When you touch and slide the whole orbit slider is moving sideways and creating kind of parallax scrolling effect. My slider has only one item and I have checked all the css and couldn't figu... (continued)

    Last Reply by Ganbaa over 5 years ago





My Comments

Ganbaa commented on Ganbaa's post almost 5 years

well I found it was somehow the issue with the local server in the building we have. When uploaded to a live server, there was no issue.

Thanks for your help. :)

Ganbaa commented on Ganbaa's post almost 5 years

Hey Katie,

Ok, it is very interesting.

Upon hosting it in an actual webserver, everything rendered correctly except one little dropdown icon messed up, but everything is good to go.

The one I tested initially on IE was from local environment where one of my network guy setup that environment to internally serve the directory, which had some weird issue with the IE.

But everything is good now. Thanks for checking into my issue, appreciate your help.

http://kopykatetc.com/ganbaa/beta/ - Link to hosted beta site

Ganbaa commented on Ganbaa's post almost 5 years

Thanks for your reply.

I will try to host it somewhere where you can access it shortly.

In IE, no matter what the screen size is, it renders the same, seems like the media querry and the grid is completely not working in IE. Very weird.

It is my bad that I haven't started testing it on IE as I didn't have access to it.

Something is going horribly wrong.

Ganbaa commented on Ganbaa's post over 5 years

@Ercan,

I'm sorry for the late reply, but I would like to thank you for the suggestions.

However, it does center the navigation, how can I achieve the magellan links being in the center without full width bar when you scroll down and magellan becomes active.

I know you have to change it in the .magellan.scss but I'm afraid whenever I do update with bower it will be overwritten.

I couldn't find a tag in settings.scss.

Thanks.

Ganbaa commented on Ganbaa's post over 5 years

Hey Chris!

I'm sorry about the late reply.

Thank you for checking into my problem. I need to explore more into the JavaScript then!

Ganbaa commented on Ganbaa's post over 5 years

I think I got it fixed. It was created by when I was adding normalizer.css.

Thanks @Malou!

Ganbaa commented on Ganbaa's post over 5 years

Yep, it is still very strange.

I just updated through bower to version 5.2.2. I think it was version 5.0.

Even after updating to the latest version, whenever I take the second slider leaving it with one slider, the "Devil Parallax Scrolling" effect comes back.

I don't understand it at all, you said when you copy my markup and css there was no "Devil Parallax Scrolling" effect right?

Ganbaa commented on Ganbaa's post over 5 years

Hey Chirs,

Thank you so much for debugging the code.

I just added secondary slider and it seemed working just fine. I guess I shouldn't use the slider for only one slider :)

I will try implementing the regular row and column to scale purpose.

Again appreciate you for being with me!

Ganbaa commented on Ganbaa's post over 5 years

Hey Chris,

I just removed the hide-for-small class and tried it on my iPhone, it is doing the same thing.

How do you check your foundation version? I really need check and make sure the bower pulled the latest version...

Did you try with just one image? I'm not planning to include several slides. It should be one slider and the reason for me to use only one slider is to take advantage of the foundation's native scalability in the slider.

Thank you so much for looking into my issue.

Ganbaa commented on Ganbaa's post over 5 years

Created an code pen, and tested it on tablet and still doing the same thing "Parallax scrolling".

http://cdpn.io/FxeJp

The last screenshot above, I made it from my tablet. The white space created on the side is when you touch and slide it to the right. It seems very sensitive to your finger movement.

device_model = iPad
device_res = 1024x768
orientation = landscape
os_name = iOS
os_version = 7.1
pixel_density = 132 ppi
request_id = 47dda31a-f614-4482-bab2-b4f2d51a4e66
status = Viewport
url = http://codepen.io/Nomadme/pen/FxeJp?editors=111

very strange.

Posts Followed


Following

    No Content

Followers

My Posts






My Comments

You commented on Ganbaa's post almost 5 years

well I found it was somehow the issue with the local server in the building we have. When uploaded to a live server, there was no issue.

Thanks for your help. :)

You commented on Ganbaa's post almost 5 years

Hey Katie,

Ok, it is very interesting.

Upon hosting it in an actual webserver, everything rendered correctly except one little dropdown icon messed up, but everything is good to go.

The one I tested initially on IE was from local environment where one of my network guy setup that environment to internally serve the directory, which had some weird issue with the IE.

But everything is good now. Thanks for checking into my issue, appreciate your help.

http://kopykatetc.com/ganbaa/beta/ - Link to hosted beta site

You commented on Ganbaa's post almost 5 years

Thanks for your reply.

I will try to host it somewhere where you can access it shortly.

In IE, no matter what the screen size is, it renders the same, seems like the media querry and the grid is completely not working in IE. Very weird.

It is my bad that I haven't started testing it on IE as I didn't have access to it.

Something is going horribly wrong.

You commented on Ganbaa's post over 5 years

@Ercan,

I'm sorry for the late reply, but I would like to thank you for the suggestions.

However, it does center the navigation, how can I achieve the magellan links being in the center without full width bar when you scroll down and magellan becomes active.

I know you have to change it in the .magellan.scss but I'm afraid whenever I do update with bower it will be overwritten.

I couldn't find a tag in settings.scss.

Thanks.

You commented on Ganbaa's post over 5 years

Hey Chris!

I'm sorry about the late reply.

Thank you for checking into my problem. I need to explore more into the JavaScript then!

You commented on Ganbaa's post over 5 years

I think I got it fixed. It was created by when I was adding normalizer.css.

Thanks @Malou!

You commented on Ganbaa's post over 5 years

Yep, it is still very strange.

I just updated through bower to version 5.2.2. I think it was version 5.0.

Even after updating to the latest version, whenever I take the second slider leaving it with one slider, the "Devil Parallax Scrolling" effect comes back.

I don't understand it at all, you said when you copy my markup and css there was no "Devil Parallax Scrolling" effect right?

You commented on Ganbaa's post over 5 years

Hey Chirs,

Thank you so much for debugging the code.

I just added secondary slider and it seemed working just fine. I guess I shouldn't use the slider for only one slider :)

I will try implementing the regular row and column to scale purpose.

Again appreciate you for being with me!

You commented on Ganbaa's post over 5 years

Hey Chris,

I just removed the hide-for-small class and tried it on my iPhone, it is doing the same thing.

How do you check your foundation version? I really need check and make sure the bower pulled the latest version...

Did you try with just one image? I'm not planning to include several slides. It should be one slider and the reason for me to use only one slider is to take advantage of the foundation's native scalability in the slider.

Thank you so much for looking into my issue.

You commented on Ganbaa's post over 5 years

Created an code pen, and tested it on tablet and still doing the same thing "Parallax scrolling".

http://cdpn.io/FxeJp

The last screenshot above, I made it from my tablet. The white space created on the side is when you touch and slide it to the right. It seems very sensitive to your finger movement.

device_model = iPad
device_res = 1024x768
orientation = landscape
os_name = iOS
os_version = 7.1
pixel_density = 132 ppi
request_id = 47dda31a-f614-4482-bab2-b4f2d51a4e66
status = Viewport
url = http://codepen.io/Nomadme/pen/FxeJp?editors=111

very strange.

Posts Followed

Following

  • No Content

Followers

  • No Content