This really has me scratching my head.
The OPTION text is cleared using this code in a Snippet:
document.querySelector('option').textContent = '';
<select>
<option>Ipso</option>
</select>
It also works in a CodePen, plus it works on my website.
However, in JSFiddle it fails – but only in Chrome.
If I set textContent to anything prior to clearing it, it then works.
This issue doesn't seem to occur with any other type of element.
If I use innerText or innerHTML instead of textContent, I get the same behavior – but again, only in Chrome. jQuery's text() method also gives the same behavior.
Is this a Chrome bug or a JSFiddle bug?
I don't know the reason for the bug, but try setting the load type (click the cog in the top right corner of the JavaScript frame) and select no wrap - in <body>.
It works on the Chrome browser on my phone (whilst your fiddle didn't), and could possibly explain what's gone wrong.
Related
I have a page with lots of scrollable containers in it. All these containers contain some list or so. Everything works perfect in all the browsers except IE7 (Having tested in IE6 and below). In IE7 when I try to scroll by clicking on the scrollbar, its not happening. But if I double click on the scrollbar, then I will get the focus on the scrollbar and I will be able to scroll. The mousewheel scroll works perfectly though.
There are a lot of jquery plugins in my page such as datatable, jquery UI, autosuggest etc.
When I disable script in my browser, the scroll works fine.
Any idea on what is happening? (as an ie7 issue)
An uncaught javascript error may be the cause of your problem. Try using try...catch, e.g.
try {
//any questionable JS code
} catch(err){
alert(err.message);
}
If there is any error, that should let you know.
Without seeing your code I'm only able to guess that your page is throwing a javascript error in ie7. There are a few javascript functions that don't work in ie7 (such as getElementsByClassName which has caught me out before). I'd suggest debugging the javascript in ie developer tools or another debugging tool to find the problem.
It seems like theres an extra click event or something blocking the scrollbar, try using $(...).unbind('click') on those elements.
Some version of IE are temperamental to non-strict syntax, e.g. if you have a missing ; somewhere. An option is to run your code through jslint but this may prove tricky if your code is not well organised.
If you have IE9 you should be able to check for errors by hitting F12, roll back the version to IE7 and monitor the console output.
Trial and error is probably the answer, if all your code is just 1 big block then I'd suggest re-factoring into manageable chunks (classes methods) first.
Good luck.
If we can use a plugin :
http://jscrollpane.kelvinluck.com/
we can easily fix this issue of cross browser scroll pane.
I have html and css as posted in http://jsfiddle.net/SLs47/ . When I open it in Chrome the title text get wraped (and misaligns) while zoom is increased. However it works fine in Firefox. Please see the following images.
What need to be altered inorder to make it working?
Chrome
Although i couldn't reproduce the error, i think changing #titleinfo 's display property to inline-block from inline should prevent it from wrapping.
I'm getting different values for offsetwidth for the same element in Firefox and Chrome, which makes the element display incorrectly. Please suggest some solution so as to have consistency.
I'm having a similar issue when I load content via AJAX with Firefox 12.
Both Chrome and IE9+ report the offsetWidth correctly after the the ready state is complete, but Firefox hasn't seem to have calculated it yet.
If you check a bit later (even delaying a half second sometimes), Firefox has the right width.
I suspect someone tried to make Firefox faster by firing the ready signal before they should be.
The original poster didn't give a lot of details, but I suspect this might be the problem.
Edit: P.S. The only way I've found to get this to work correctly is to delay and keep checking back until it has the right value.
I had problem with offsetHeight, I replaced it to scrollHeight and it works for me.
http://jsfiddle.net/4t6j5/2/ (this seems to be working normally)
http://www.periferi.nu/#filter=.utstallningar (this does not)
Se the jsFiddle where I have tried to reproduce the error using the parts that are erroneous.
So the problem is that in IE8 and down the read more element starts jumping a whole lot instead of simply sliding in from below when the mouse is over the image. Works perfect in most modern browsers but in IE8 and down it starts jumping (especially when hovering the p elements, for some reason).
It appears that when the code from that part is isolated it works.
Why does it behave differently in IE? Any help is appreciated!
Ok after endless hours I have captured the bug in my css file. Strange case but thanks WTK for the direction. Turns out:
html {overflow-y:scroll;}
Was the main problem for some for me unknown reason.
If someone sits on further information as of why this happens in IE please share.
http://jsfiddle.net/4t6j5/3/ (Bug hunting fiddle)
We have an automatic slider on this website, http://www.realcapfinancial.com and it has been working on all browsers. IE9 doesnt seem to work. It comes up with and error, no object line 298... character 2 etc. I forget what it says but I can't check it again since I'm at work using a mac.
Any help is perfect, thank you
The element with id calcclick is only added after the Resources tab is click. However, this element is already adressed (on line 298) on page load.