When viewing the following page in IE7, then hovering over the google map at the top, all of the little "globe" images in the lists disappear, as well as the lines containing "Total number: x" and the show/hide list button. The disappearing elements both have styles of position:relative set in the links stylesheets.
http://wetlandinfo.derm.qld.gov.au/wetlands/MappingFandD/WetlandMapsAndData/SummaryInfo/B-422.jsp
Adding the min-width:0 style to the elements does not prevent the bug, and I haven't seen any other workarounds for the IE7 peekaboo bug.
Can anyone figure out how I can prevent the elements from disappearing?
Thanks
Martin
this probably won't help, but as soon as i moused over the maps i got this error:
Line: 719
Character: 66
Code: 0
Error Message: 'this.yf' is null or not an object;
and there was another error on page load.
i would at least start with those.
Related
I got the very strange bug with angular-ui bootstrap tooltips. When its attribute tooltip-append-to-body set to true on some pages (not all of them) it doesn't work. Every time I hover the target element angular-ui appends the element to DOM (look at the screenshot), and don't delete it on "unhover".
I will be very appreciated for any thoughts about possible reasons.
I found the reason of such a strange behavior:
on those pages when the bug happens I have the 3rd-party SVG component, which is using foreignObject. This foreignObject hosts html with the body tag in it...
I am using Superfish with the Drupal 7 At Commerce theme (Adaptive Themes).
The main menu is not displaying properly. The menu is only filling the upper half of the Main Menu Block as provided by the theme. Also, the menu items are crunched together too closely.
The image shows the menu, at only half its vertical size with menu items crunched together.
I have used this theme with superfish before and never had to do any special styling.
I think I am missing something or have not configured something correctly.
I appreciate any help.
Jack
I found the problem. It is in the theme/sub-theme. It turns out that the minor version of the theme and sub-theme must match. I reinstalled both and the problem went away.
Is it possible to enter a CSS selector into firebug and for it to highlight the corresponding element(s)?
Thanks
Yes.
Go to the CSS panel in Firebug.
On the right hand side, there is a console that lets you try selectors. It will prompt you with "Try a selector....". It displays all matches in the right hand window and lets you highlight them on hover.
link to firebug wiki: https://getfirebug.com/wiki/index.php/Elements_Side_Panel
The search box in Firebug aka Firefox Inspector (Ctrl+F or Cmd+F), as suggested by Madbreaks in the question comments, really works with any complex CSS selection! It says "Search HTML" on the UI, which is a bit misleading, but matches CSS selectors, it's not just a simple text search.
Tested on FF v33.0
I've wasted too much time on this and am begging, begging, I tell you, the stackoverflow community for help!
I'm a new jqGrid user, and have my grid working as I want it to, but at the moment, cannot get a row to highlight in IE 7 as the mouse is hovered over it. Our shop is currently running IE7, so changing browsers/versions is not a possibility. Hover works great in Firefox, does not work in IE7.
I have googled endlessly for "jqgrid ie7 hover", "jquery ie7 hover", and any iteration of "ie7" and "hover", and "css" and all that.
I have tried so many variations of DOCTYPE declarations it ain't funny. I've tried reverse engineering the http://www.trirand.com/blog/jqgrid/jqgrid.html demo pages until my fingers are aching. Yes, the hover works on the demo pages. No it ain't working on my own page. I have tried manually passing in the ui hover CSS classes directly with different attributes and the !important flag just to see if I get anything. Nothing.
Now here is what does happen when I hover over a jqGrid row with IE7: The bottom and right borders of the table cells will change color, but the background color does not. So, I know the hover highlighting is working for the cell borders, but not for the cells or row itself.
As a diagnostic aid, I slapped in a javascript alert() to bang when I hovered over the table. It works at the table level, but does not ever fire if I set it to fire if I hover over a row or cell. I used the IE Developer Toolbar DOM parser to verify I'm calling it right. I'm wondering if jqGrid takes over that functionality, though.
Anyhow, folks, the short version is: Why can't I get row highlighting to work in IE7?
Help me Obi Wan Kenobi, you're my only hope!
I'll answer my own question. The problem was a conflict with a separate .css file. My page uses the 960 Grid System for layout control. One of the items used as part of the grid system is a "reset.css" which was conflicting with the jqGrid hover display in my app. I commented out the call to reset.css and the problem went away. Fwiw, I did not see any other adverse affects to the grid system by leaving out reset.css.
I am trying to call one div on click of select element. there are 4 select elements two in each row. When that div is called it goes behind the succesive select element. This issue is specific to IE7. It works fine with IE8 and firefox3.
please can anybody help...
Thanks,
You can read the following link for a detailed info
How the Z-index Attribute Works for HTML Elements
There are two work around for this.
The first is to hide the select element when the div appears. This might not be a good solution.
The other better solutions is to place an iframe at the same position as that of the div.
The iFrame must be added at the end of the page so that it appears in front of all other windowed controls (the windowed controls are stacked in the order in which they appear on the page). That takes care of covering any SELECT that may be in our way.
You can have a look at the code in the page
Bug Fix: SELECT box displayed through Dynamic DIV in Internet Explorer