My site is:
http://chanbaneng.com/demo/
When I browse using mobile browser like Samsung smartphones' default browser, I can not view the drop down menu under "Partners". It works fine if I'm using Chrome mobile.
The biggest problem is, for some mobile browsers like the default one in Samsung Galaxy S5 and Note 3, include iPad and iPhone, the whole menu is gone, and left with a drop down on the right corner. When click, the whole menu content is out of place.
Anything I can do to fix this?
I'm thinking of detecting mobile browser and display a message and ask them use Chrome, however I don't know how to "not display" the message when the mobile browser is already Chrome.
please Try the below code.
/*style.cs line no.246*/
#cssmenu ul.open li, #cssmenu > ul.open > li {
clear: both; /*new edit*/
display: block;
}
Related
we are developing e-commerce website for our customer and we have a strange problem just with iPad. User cannot select some elements such as dropdowns and radio-buttons in product configuration on iPad. We have noticed this in Safari and also in Opera browser. The URL is http://slovenskeokno.sk/sk/plastove-okna/311-okno-balance.html. Everything else runs well on other devices (PC, Android) even on iPhone. Does anybody have a clue where is the problem? Thanks.
In situations like this, you'll need to promote these layers a bit higher using z-index. This fixes both of your issues (unreachable radio buttons & dropdowns).
.form-group {
z-index: 1;
}
I am new to this coding stuff and I've made a portfolio site and it works fine on chrome and safari but for some reason in Firefox the projects section doesnt work right, theres no skew and I can't click on the more info button, any ideas?
portfolio site
Try to remove z-index: -1; property from .projects class. With z-index: -1; you are hiding block with more info buttons below the body block, and you can't click it.
I'm not trying to auto focus on textarea, just when the user clicks on it. However it simply doesn't work sometimes. The user clicks on the textarea but no keyboard pops up. Why?
Try my website: http://162.243.161.127 on mobile safari. On the top menu click on chat, you should see a textarea that you can type in. Half the time focusing on it doesn't work. Where do I begin to debug, thanks.
Ah, pesky :hovers. They're terrible on touch devices, for so many reasons..
Remove this and see if it helps.
.chatInputContainer:hover .image {
display: block
}
Then you'll need to figure out a way to provide :hover for desktops only.
I have a full width 3 level navigation, please see:
http://acemenu.zzcreative.com/test/logged-in.php
I am checking the menu across all browsers, in IE8 the menu does not appear when clicking the 'Menu' link.
Also I am told it does not work to well in FF on a PC?
Any ideas?
The menu displays in IE when you remove the z-index: 999 from the div with id sticky-header-logged-in
Its an iOS problem only.
I have a floating hidden div with "...loading" appear in the current page upon following links within the application. This is again hidden by default on the following page.
The problem is that when the user then hits the back button it appears again, unhidden, on mobile safari. This is not a problem on desktop browsers.
This code below works on desktop Firefox, Chrome, and Safari, but not on mobile Safari on iO5 iPhone and iPad.
<body style="margin: 0; padding: 0" onunload="$('#loading').hide()" onload="setTimeout(function() { window.scrollTo(0, 1) }, 100);">
Any thoughts?
For Safari on iOs you can do this:
window.addEventListener('popstate', function(e) {$('#loading').hide()});
Based on this answer:
Is there an alternative method to use onbeforeunload in mobile safari?