Image Flickering only in Firefox - firefox

I have a popop on my page with cross button image.
When I open the popup for the first time everything is fine.
But when I close the popup and open it again, the cross button image flickers.
How can I Fix this.
I am facing this problem only in firefox. Are there any configuration settings which i need to make?

Got the issue. A button click function was written twice because of which the popup was loading twice and the image flickering happened.

Related

Odd modal behavior with MaterializeCSS in Firefox

I found a really strange behavior when using a Materialize CSS modal in Firefox (66.0.1). It works fine in Chrome (73.0.3683.86) and MS Edge (where do you find the version?). I'm using Windows 10. It does this with the modal demo in the official Materialize CSS website as well.
The problem seems to start if you display a modal with enough content so that it displays a vertical scrollbar. It needs to have links or buttons to see the problem I will describe. You can simulate this by resizing Firefox so that its vertical height is small enough to make the scrollbar appear. Now close the modal. Then resize the height of Firefox so that the modal will appear without scrollbars. Open the modal and hover over a link or button and any hover effect that should happen, does not. Click once on any link or button and nothing happens. Click a second time and it works properly.
And even odder, after opening the first modal with a scrollbar, you can open the second without a scrollbar and do nothing for about 15 seconds and then the links or buttons will work fine.
When this happened, I tried right-clicking on the button to "inspect the element" in the Firefox Inspector. Instead of getting the button, I got the modal overlay element behind it. Note that when this happens, the overlay is not above the button or any of the modal content. It's not a z-index problem. To see whether it was a problem with the overlay, I added an onOpenEnd() function to the modal options that would remove the overlay as soon as the modal opened. I had the same problem. When I tried again to open it in the inspector, I got whatever was behind the button. So it's almost like the modal isn't even there until I click on the modal first or wait for 15 seconds.
I then tried to add some code to the onOpenEnd() function that would give focus to the button, but no effect with that. I tried tabbing to the button, but that didn't work either.
Just before submitting this I found another piece of the puzzle. As I said, hovering over the buttons when this is happening will not show the usual hover pointer. But if I hover above and a bit to the left of the buttons, the cursor does change. When I click there, the color of the buttons does change like it's been clicked, but the action (closing the modal) does not happen. Hmmmmm....
If you want to test this out, go to the Materialize CSS webisite and open the page for modals. (https://materializecss.com/modals.html) Reduce the vertical size of Firefox so that when you open the demo modal it has a vertical scrollbar. Now close the modal. Resize Firefox back to normal vertical height and open the modal again. Hover over the Agree or Disagree buttons and you won't get the pointer cursor. Try click once and nothing happens. Click again and the modal will close. Or wait the 15 seconds and then the buttons work.
Most of my users will have the modal open for more than 15 seconds so it's not a big problem. But sometimes they will open it just to check something and then want to close it. Sure they can click twice, but I'd rather it work properly. Chrome and Edge work fine. Firefox doesn't. Can anyone think of what is causing this and whether there is anything I can do in my code to make it work properly? Thanks.

Cannot Select image file from external file browser with ckeditor4 but it works perfectly in ckeditor3

Hello to anyone who may be able to help with this.
I had been using Ckeditor3 and had created a simple custom image browser. It worked perfectly. I would click the image button and the dialog box would pop up and then I would click the browse server button. I searched the images and when I found one I wanted to use I clicked it the image browser would automatically close and the image would then show up in the image preview box in the image plugin dialog box.
Unfortunately the image plugin for ckeditor 3 has become incompatible with Internet Explorer 11. So I upgraded to the latest Ckeditor 4.
So now in ckeditor 4 I can still open the image dialog and click the image browser and browse my images but now when I select an image, although the image browser closes as it should the image is not being passed back to the plugins preview box or url field within the dialog box. It just remains blank. If i manually paste in an image url the image will show up in the preview box but no longer from the image browser anymore.
i have spent hours looking for a solution on google and am coming up empty, anyone have any ideas?
PROBLEM SOLVED
To fix the problem I had to change the code in the file browser as follows. I do not know why the first snipped works in ckeditor 3 but not 4.
function selectFile(fileUrl){
window.opener.CKEDITOR.tools.callFunction(2, fileUrl);
}
Change to:
function selectFile(fileUrl){
window.opener.CKEDITOR.tools.callFunction(1, fileUrl);
}
But now everything is forking fine in CK editor 4.

Firefox won't display an image unless the web inspector is open

Firefox sometimes hasn't been displaying my website's logo image. There's nothing in the code I can find that would make this happen. From what I can tell, the image displays fine in WebKit, and displays fine when the FF web inspector is open, and displays fine after a hard reload (Ctrl+R), but sometimes won't appear after a soft reload. When I right-click on the image, or open the web inspector, the image suddenly appears, as if it had been there the whole time. What could be causing this?
i think it can be something about page resizing.
When you open the webkit your website browser window change dimension, and you see the logo.
maybe this two things are connected.
try to resize the browser window without opening the webkit.
hope this works to catch the problem.
I tried disabling all the Firefox plugins, thinking it was some extension that was causing this, but no luck. I finally got it to work as expected by completely resetting Firefox using this guide.

J! not responding when selecting banner image

I'm experiencing a weird problem:
When creating a new article I click the image button a popup window appears but it doesn't show anything to allow for image upload and it just hangs there. Same thing happens when I try to select an image in the Banner Manager.
I've tried with different browsers and from different locations...
Any idea what might be happening?

Kendo window 1st open and then load

I have a kendo window in my project. Now the content is coming form another domain. I used i-frame in the content template. Its working fine. But When i click the button to open the kendo window it coming but not smoothly. Its stucking. so I want, when I click the button window open smoothly and then load the content. I searched for it but did not find any solution. Its better if i can open the window first and show a loader until the content comes.
Please help me.
The problem can be solved by making the animation:false
A kendo window fires an event called "activate" when it has finished displaying its opening animation. You can catch this event and then load your data in a handler function. There is no need to deactivate the animation itself.

Resources