I have set up a page in Joomla, and coded a template.
It all works great, but in IE my hovers in CSS doesn't work.
No matter where I do hover on the page, it simply doesn't react in IE.
...Works great on all other browsers though.
If I set up a page, that is not using Joomla, the hover works perfect, so I think it has something to do with Joomla.
I couldn't find anything about this problem on google, so has anyone had this problem and do you know have to solve?
Thanks.
Related
The site (Wordpress) I'm working on is https://www.mosquitohunters.com/
It's a custom developed theme, so I'm not sure how the menu was set up originally, but when I try to add sub-menu items for a dropdown menu, things get really screwed up.
I can fix most of the styling issues with CSS, however the hover to activate the dropdown has me stumped. It seems like it's being done with javascript or jquery, and it's jumpy and doesn't work properly.
My question is...what is the best way to fix this? Is there something I should be looking for in the .js file that I can deactivate or turn off and just make the dropdown a :hover state instead? Seems like it would make more sense...
Thanks!
The website uses this plugin:
https://www.wordpress.org/plugins/megamenu/
Since this file is included: https://www.mosquitohunters.com/wp-content/plugins/megamenu/js/maxmegamenu.js?ver=2.3
This is really odd. I'm not complaining that something works, but it is very surprising ..
On my website I had the usual css :hover for the navigation to reveal sublinks. But on the mobile browsers this needed some js help to make it work (as you can see from those many posts about "css hover not working on mobile browsers")
I made a simple script to fix the hover problem. But today as I was rewriting the code, since I noticed that it was not fully working as intended, I removed the entire mobileDetect.js which was handling the mobile hover. And now it works, without any additional scripts.
I tested it with chrome and safari on my ipad and iphone. It works as intended... did I misse out a big mobile browser update or something?
I use Jquery from google, no framework and standard HTML5.
Here is the site : (easy-sailing.ch) "EVENTS" and "AUSBILDUNG" are the mentioned navigations with sublinks.
I am just wondering if this is some odd anomaly and therefor should put my script back in or just enjoy the good news? :S
as far as i remember it has always been working...
...it is just not needed because there's no cursor and hover happens usually when you click (touch in this case) and you'll leave the page before noticing hover.
on android i can observe it when i touch+slide up or down.
I have fixed this for me by removing :hover selectors/rules at runtime https://github.com/kof/remove-hover
I'm working on a site and I have a big css problem; my menus are 'Swinging' in a very weird manner when hovered. The css / html code on its own works well, but once I implement the slider within the real site it behaves differently. Its probably a css issue, but also to note is my site is built on a Responsive theme. Anyone with an idea of how I can fix this please lete kme know. Thanks. Here is the link to the site.
When you say "swinging" do you mean the effect where they start at the top-left then grow diagonally to the bottom-right? That's jQuery's ".show" event firing. Try replacing that with ".slideToggle".
Unfortunately the Wordpress template you're using is quite messy so it's hard to troubleshoot.
I am building a photo portfolio website using wordpress and editing an existing theme. I worked on it in firefox and checked a few times throughout at the styling in IE and it was always fine. But having basically finished I looked at it today and it in IE and it is totally messed up. None of the boxes on the main page are lined up right.
I tried using the code in the header to have IE render it as IE7 and that generally worked but it made some other little problems. I am not sure if the problem is my doctype. I don't really know what it should be, or if I changed something along the way that messed it up.
The site works perfectly in all other browsers that I have tried
Here is the site. http://theshalomimaginative.com/blog/
Thanks.
Youre <h3> tags aren't closed. One of the few instances where IE is actually rendering things correctly ;) Other browsers will allow us to make mistakes like this, but IE is more strict.
Never forget the value of validating your code!
I'm using simplemodal on a website I'm developing. Everything was working fine across all browsers until I added "overflow: auto;" to my simplemodal CSS as such:
#simplemodal-container {height:90%; width:80%; color:#fff; overflow:
auto;}
I get the scrollbars when needed in FF, Safari, and Chrome just fine, but when I look at it in IE8 (haven't tried IE6 or IE7), most if not all of the content of the modal is missing. It appears to be spinning as though it's waiting for the server, but nothing happens.
I've looked everywhere online for an answer to this issue, but haven't been able to find anyone else who's having the same issue.
Please let me know if you need anything else from me.
Thank you in advance!
Pekka, thanks for taking a look. I was sure that it wasn't the javascript, because one of the buttons, (resume) links to a simple html doc with a table and that wasn't even showing up.
But I think I've figured it out!
In the CSS, there were also some opacity settings, which I pretty much copied over from the simplemodal website. But one of the settings was an IE workaround that was throwing errors whenever I validated the page. So about 5 minutes ago, I thought, "hm. I wonder if I get rid of those opacity settings if that might do the trick." I wasn't really using them anyway - I had set the opacity of my modal window to 100%. So I just got rid of the settings, and now it works in IE. Go figure.
On the "images" modal, my thumbnails are getting cut off in IE, so I do have one more thing to figure out, but at least it's showing up now!
HOO-RAY.