Site works fine on other browsers except for Firefox - javascript

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.

Related

Modal is not clickable after appearing - Safari

SAFARI ONLY
I have encountered weird bug on desktop Safari.
I wanted to display modal after reaching some point when scrolling website. Unfortunately when we do that on safari modal is not clickable (z-index issue?). I've been using react + react-modal, but I think that this issue is not related to any of those.
Source code + demo: https://codesandbox.io/s/p5x9331y8x
I've noticed that when we wrap triggering function in setTimeout() we will be able to see that modal stops working only when it appear while scroll event. https://codesandbox.io/s/3q7rmpj1mq
Ofc setTimeout() is not a solution here...
I've found issues related to this but any of them is not matching my problem exactly:
https://github.com/reactjs/react-modal/issues/369
https://css-tricks.com/forums/topic/safari-for-ios-z-index-ordering-bug-while-scrolling-a-page-with-a-fixed-element/
Also when there is no overflow: hidden on body it works properly but thats not a solution here either (obviously we want to prevent background from scrolling).
Note: Regarding demo, modal appears after reaching last section of page (this problem is recreated). It's good to open page in full screen for testing.
Any help would be really appreciated.
Issue was solved by changing from overflow: hidden to overflow-y: hidden...

Strange website behaviour on iPad

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;
}

CSS Menu display issues in Mobile Web Browser

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;
}

Navigation not working in IE8

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

Lightbox close link doesn't work in IE7

While the lightbox example page works fine for me in IE7, I seem to have broken it in my implementation.
I've written a Lightbox plugin for Mango Blog and everything works fine in Firefox. However, in IE7 the "close" button doesn't work. If I'm fast enough to get my cursor into the position that the close button will be placed before it slides into place, the IE status bar shows the "#" link, but clicking or moving the cursor makes the status bar go blank -- and of course nothing happens.
Not that it was that necessary, but I made a quick screencast of the behavior in IE7. Note the cursor not switching to a hand on the close button.
Any ideas how to fix this?
Perhaps you should try to use the actual 2.0.4 version of Lightbox as a base, there seem to be several changes in the DOM code, although nothing like the bug you described is mentioned in the changelog.

Categories

Resources