I am having trouble with hiding an element that is used as file select for PLupload.
The following code works in Chrome, Firefox, IE10,...
Click "clickme", then clicking "Me no work in IE" will open a CommonDialogBox to select files, and "Hello!" will appear.
http://fiddle.jshell.net/hZY67/13
For IE8:
http://fiddle.jshell.net/hZY67/13/show
Observation: In IE8 the CommonDialogBox doesn't pop up, but "Hello!" appears
Now remove display:none from the css.=> problem solved
Conclusion: When an element is attached to PLupload as fileselect, and a parent element's display is toggled, the connection between the fileselect and PLupload breaks.
Any light on this situation and possible workaround appreciated :)
http://www.plupload.com/punbb/viewtopic.php?pid=2381#p2381
#E-SPAR, Plupload needs to measure elements to generate file dialog trigger and position it properly, which obviously is not possible on elements having: display:none;. You might want to call refresh, after you show up your dialog.
In case of Plupload UI widget:
$('#uploader').plupload('getUploader').refresh();
Related
I am having trouble with my gwt application on Chrome (mac os + windows) when I drag and drop.
I don't know when it started, which chrome update.
When I drag and drop an html item it hides most of the screen except the html item I use.
Here is the video : https://drive.google.com/file/d/14d13CrzKPRwB1nAgAcIMQI_4PBHBaXo8/view?usp=sharing
To reproduce this, I remove all the html from my application except a small part (what you can see on the video)
I keep all js + css, I put break points on all html elements, to see if something is changing on drop event.
There is something with gwt because If I remove the iframe with my application name as id I don't have the problem anymore.
No problem on firefox or safari, no html or css is modified when I drop the html element so I thought the problem was chrome but when I remove the iframe with my application name as id it works (but my application doesn't work anymore).
I don't know why when I resize the window the screen is refreshed and everything is ok too.
Edit it works with the chrome bêta https://www.google.com/intl/fr/chrome/beta/ so chrome problem
Ok with v105
Not Ok with v106
Ok with bêta v107
I have an issue with JAWS screen reader on IE browser. It reads the span tag with role="alert" twice.
This issue does not occur on Firefox and Chrome.
Also NVDA works fine with IE as well.
Only JAWS with IE is giving the issue.
After searching on internet I found the following from this site
role="alert"
This should be used for important messages that should be read by a screen reader as soon as they appear. ARIA alerts can be useful when implemented correctly, but there are so many ways an alert can go wrong. A few examples:
A hidden element has role="alert" applied when the page loads, so the screen reader reads the alert immediately (even if it is visually hidden) instead of reading it when it appears.
Focus is set to the alert when it appears, so it is read twice (once because it is an alert and again because it has focus).
ARIA alerts are triggered repeatedly, overwhelming a screen reader user.
I am guessing the above point is the reason for this.
Please help. I will add my Angular code sample if required.
You have several possible options but it is difficult to tell what is best without the code sample
Look at aria-hidden="isItIE" to get the screen reader to ignore the element if IE - isItIE would be true or false
or maybe don't make it a hidden element? Use an ngif and only show it conditionally after the page has loaded so it is not part of the dom at the start...again your condition can be based on whether the browser ie IE or not
I have this landing page, for some reason I can't see the check box, submit button and a div that are in the code. Everything works in chrome and Firefox. I understand that IE dosen't always get media queries so I made this landing page that calls a diferent css file when it detects IE, but it made no difference.
I have a few questions:
1. What is causing this?
2. How can I fix it? Is there a file, like modernizer, that I can load to modify code for IE.
3. I am also using this js addon on the second link with a separate css file, in order to see place holders in IE. This also doesn't work, if someone could tell me why, that would be great
I see the checkbox just fine in IE. why don't you show an image of what you are seeing. Also, clear your browser cache.
To help debug, you should press F12, then click on console. make sure there are no errors. Then click Network. Make sure all css/javascript is loaded with no errors. finally, in the dom explorer, click the arrow, and click on the page and see if the elements are there.
as i see it this is the solution to my question
at the top of the css file i had this row:
#import url(http://fonts.googleapis.com/earlyaccess/opensanshebrew.css);
once i removed it i got the mossing elemnts.
tnx for helping
Dav
I've been noticing some problems with chrome and the inspect element functionality.
When the page I'm currently developing loads, some elements are misplaced (The text in this case):
Whenever I right click and select inspect element on the container of the misplaced element:
The element gets then magically placed as it should be:
You may have noticed I'm using nvd3.js, however this has happened to me before, and without nvd3.js. I don't think it's a nvd3 problem (I may be wrong).
My question is: Does the "inspect element" of chrome trigger some sort of recalculation of the layout?
Thanks in advance.
Youre Using .resize() or css media queries and when you click inspect element and console window opens (fixed in bottom part of chrome) youre screen resizes and some media query or .resize() funcion affects text alignment
I have TinyMCE opening in jquery.colorbox, everything is working, all the icons are clickable and I can update the textarea via the HTML icon but I can’t click into the actual editor box!
If I open TinyMCE outside Colorbox everything works fine.
Has anyone come across this before and if so how can I fix it?
Latest Edit, not getting any loving here!
I just worked out that this actually almost works perfectly in IE. In Chrome and FF I can’t type into the box but in IE I can, BUT only if I hit "THE ANY KEY" while my cursor has the focus of the box. The text then miraculously appears and I can type and update at will.
Anyone???
Old Edits Below
Could this be a z-index issue, I'm not sure because everything else opens on top of ColorBox, including Insert Image and my file browser. it's just the TextAera that I cant click into!
A More little more info
My website is MVC3 and i'm loading TinyMCE as done in this tutorial: http://www.tugberkugurlu.com/archive/tinymce-html-text-editior-and-asp-net-mvc-setting-it-up-has-become-easy-with-nuget
Anything I can find regarding this problem is loading tinyMCE at the same time as jQuery ColorBox or jQuery Dialog, which yields the same result.
People doing this in PHP and other tech have been having more trouble, in my case everything works but I cant type into the testArea/EditorFor.
I now think z-index has nothing to do with it so i'm going to try and make sure TinyMCE is loaded after ColorBox has completed loading!
I believe this is because colorbox traps the focus and prevents focus on anything outside the colorbox bounds. TinyMCE creates an iFrame outside the colorbox and you can't click on it.
Try setting trapFocus to false in the colorbox options.
Add link as option in plugins plugins: "link