When i scroll right or left or up and down on mobile devices, my site seems to detach from the browser, here's a link http://www.lunacarpentry.com Not sure why?
Related
I can't click on any building pictures links (at the very bottom of the homepage) when going on mobile a this project whatever safari, chrome or firefox (while it's working well on desktop) :
here is the concerned building pictures links
Do you have any ideas of how I can fix that ?
Thanks for your help !
I can click them on an iPhone 8 with Chrome Browser.
But i can only click them outside of the colored border. So the colored border is above the image which contains the link.
Check the z-index property and the media queries. You will see, that the border is above the image on mobile devices and below the image on desktop screens.
I am working on creating a parallax-ish scrolling effect for the mobile version of my site. The effect works fine on a desktop when I shrink the browser, or when I use Chrome's mobile viewer, but it doesn't work on my phone.
Here's the live example. Shrink your browser below 980px wide to see the effect. http://imbibe.staging.wpengine.com/
It appears that on mobile, the background image is shown at full size, and doesn't remain fixed.
It's just a CSS effect, no js or anything. Let me know what more details I can provide and I will! Thanks.
The entire screen flashes blue briefly with mobile chrome and hyperlinks using responsive.menu in wordpress. I'm looking to remove this effect.
You can reproduce the issue by using chrome and putting the browser in mobile mode. Navigate the browser to http://responsive.menu and use their menu on the right hand side, simply click the plus and minus arrows on the sub menu to demonstrate the effect.
Also, a screen shot and screen cast:
Shot:
https://drive.google.com/uc?export=download&id=0B-M6Yes83t08RjJ1T1IxU2JDTjg
Screen cast:
https://drive.google.com/uc?export=download&id=0B-M6Yes83t08cTRJbXNNTGdjcmM
From the author of the component:
it is due to the fact that for mobiles to detect a click event on the
body of the site without reverting to loading the jQuery mobile
library, I have added cursor: pointer; to the body.
This has the side effect of creating these blue flashes on mobile
Chrome as the browser now thinks that the whole body is a link. The
quickest option is to turn off the "Click to close menu on body
clicks" option while I see if there is a workaround in the long term.
The only way around this I can think of is to load jQuery mobile
separately, but I was always reluctant to do this.
Question update:
This only happens on chrome mobile - how do you emulate safari and firefox mobile behavior?
When opening the main menu (hamburger icon top right) of my page (password = "shooga1") on a smartphone, menu items are not there - menu is empty. Opening the same menu on desktop, after reducing browser window to make it narrow like on a smartphone, the exact same menu works normally.
This problem occurs regardless of which mobile browser or desktop browser is used. Pretty puzzling, any suggestion as to what is the problem or how to solve it would be appreciated.
I think the problem is that the mobile menu is empty.
In your website, there is an object's id called mobile-menu, and when users use the mobile phone to check the menu, this area will become visible.
(Normally it's invisible. When you touch the icon on the top-right side, it will become visible.)
But I can not see any code in this area. That means you designed the menu for desktop only and you maybe need to design the menu for mobile, too.
It's up to the framework you use. Maybe there are some methods that can be used to let the menu for mobile be the same as the menu for desktop.
I developed a website which displays full webpages within a lightbox when certain images are clicked - the pages relate to the images. The pages are inside an IFRAME which is inside the lightbox's content div.
The problem is this: when the page inside the lightbox is longer than the height of the lightbox and the site is being viewed on iPhone/iPad, there appears to be no way to scroll the interior page - scrolling gestures scroll the outermost page (the one that the lightbox is overlaying). Mobile Safari has no scrollbars, depending entirely on gestures for scrolling, so the interior/overlayed lightbox IFRAME seems to be unscrollable.
Are there any solutions to this? Do I need to special-case mobile browsers and open a new browser window or navigate entirely to the IFRAME'd page instead of using the lightbox?
This seems to be a real shortcoming of mobile Safari!
(Not really relevant but perhaps useful info - the site is Drupal-based; the lightbox is the Lighbox2 module.)
While not addressing the pretty serious problem of unnoticeable content on mobile safari, I would like to mention you can usually scroll this kind of content with a two-fingered scroll/swipe.
As for your case, I would do a mobile browser detect and present the user with a new browser window.