I have a site with a parallax effect. I want to disable this javascript for mobile devices. In antoher post I saw a link to the site: http://detectmobilebrowsers.com/
I post my javascript for parallax on:
http://pastie.org/5024950
The problem is, that it works just the opposit. On my desktop pc I have no parallax and on the mobile devices it is! What do I have to change so it works the opposit way?
Thanks already.
The following article from Viget should cover your requirements.
Managing JavaScript on Responsive Websites
I find the parallax effect doesn't work that good on iOS devices including iPads because of the way scrolling is registered at the end of the scroll and not during. So screen size doesn't really work as a check.
Related
I am currently working on my portfolio site, and I wanted to have some kind of parallax effect. So after I researched I bit, I found rellax.js, which claims to work on mobile browsers too. But now when I view my site on a mobile browser, it is stuttering. I was wondering if this is an Issue from my site, or if it is a general problem with this plugin(even though the example site of rellax.js works perfectly fine on mobile Browsers).
Where to look (and how to recreate) for the stuttering effect: The plugin affects the Header part of the site as well as the card that is somewhat overlapping the header on scrolling. To achieve the effect just scroll the site down and up.
I hope I provided enough information about my problem. The problem can't be recreated on a site like jsfiddle or codepen, because I don't know what is causing it.
I've developed a one-page website using Bootstrap. http://cpproject.co.uk/social2/
The website works totally fine on all other devices, responsive and also you can scroll.
However, you can't scroll using the touch screen on Windows Devices and Laptops which have touch screen and using the IE Browser. (Works fine on Chrome on a Touch Laptop)
I can't find anything similar to this. I would really appreciate any help or fixes.
Thanks a lot in advance.
I have a problem with the view on mobile phone and tablets, i want the banner to show animation in mobile phones, i know that flash won't work for that for sure, so what alternative is there to make this possible, and maybe long so i think GIF also won't work.
any ideas?
Thanks all in advance!
Another great option for mobile and desktop alike is the WOW slider, which is a jquery plugin you can add to a page pretty simply:
http://wowslider.com/
If you have a specific question on how to implement a slideshow, post back for more help.
You can animate a banner using normal UIImageView animation methods, cocos2d or HTML5. You can also use CoreAnimation. If you want to understand how to animate it, do add some details to the question.
Use ImageView and Split the gif file into several parts and then apply animation to it or refer this
Through the use of the jQuery framework, you should be able to google and find various plug-ins that can help animate your header, even on mobile devices. If you learn the jQuery API, you can also animate most HTML element blocks on both desktop and mobile device platforms.
I'm creating a Flash Air application for desktop. The goal is to create an app that opens up a webpage, shows virtual keyboard and duplicates the behaviour of scrolling like in iOS browser : you scroll with your finger - not with the scrollbar.
As I'm creating it on desktop, I need to scroll it with the mouse.The application is nearly complete. I'm connecting webpage with Air application using StageWebViewBridge. Now I need to create touch screen effect for scroll.
To do that - I need JavaScript. Can anyoone suggest something ?
Here's the reference : http://dev.sencha.com/deploy/touch/examples/production/kitchensink/#demo/list
PS : This is Sencha framework - suited for mobile devices. I need that kind of dragging scroll on my desctop device!
If you're looking for the same kind of scrolling like in iOS you should search for momentum scrolling. You'll find, for example, those JavaScript libraries "iScroll" and "Scrollability". Take a look, how they manage the scrolling.
Also interesting is this article on how scrolling on iOS works:
http://ariya.ofilabs.com/2011/10/flick-list-with-its-momentum-scrolling-and-deceleration.html
Hope this helps, and happy refactoring. ;)
I'm building a draggable timeline of sorts for a new project using some simple jquery ui features and have run into a problem regarding mobile devices.
Namely, drag and drop just doesn't work on touch screen devices like that. I've noticed any video players you pull up run proprietary plugins on your phone so moving the timeline around is not an issue. But, seeing as I'm not really doing video, I was hoping for some sort of work around.
Thoughts?
You could try to use JQuery Mobile Drag and Drop
See here for some documentation.
NOTE Using JQuery mobile will work on some phones, but not all phones. Older Blackberries, HTC Phones, and many other ones cannot handle many JQuery Mobile calls. Look at this page for more information on compatability