I'm trying to use Nivo Slider with a database of images. It works, but images don't load properly. Instead, they flash. It appears as though they're completely reloading every time, instead of only on the initial load. It's a strange issue.
It's on this page: http://www.holyfamilyshorewood.org/
Someone else set up the database, so I'm not entirely sure how to fix this issue.
This issue only appears in Chrome. But there is a fix for that.
Instructions are for IIS6 but i guess it is basically the same for IIS7.
Open IIS and navigate to the folder in the website which contains the
images you're having problems with. Right click it and select Properties:
In the dialog window, select the HTTP Headers tab:
Tick the Enable Content Expiration box.
Set the Expire After option and set it to 30 Minutes, or whatever
you're comfortable with.
Press OK.
This is discussed here.
Related
I have a simple "360 Tours" page on a client's Opencart website, using an iFrame on an info page. The page opens with an outside view, the visitor can then select other areas to view by clicking links below. The viewer code pannellum.htm and all the panoramic images are hosted on the client's server with the viewer displayed in an iFrame based on Pannellum's examples.
This was trivial to get working and has operated correctly for months but recently stopped working, displaying nothing where the panoramas once were. I tried Chrome, Firefox & Safari under OSX, Windows and an iPad without Joy. However, this morning I noted that my Chromebook still worked perfectly. So, I updated the Chromebook and it too stopped working. Nothing at my end has changed, though I did update to the latest pannellum.htm today to no avail.
A JS function load360() forms a url and loads this into the .src property of the iFrame which is located by id. Originally, the working code looked like this:
let url=...
let frame=document.getElementById("mf-360");
frame.src=url;
frame.contentWindow.location.reload(true);
Searching reveals that the reload is not required and simply assigning a new url to the .src property should be enough to force a refresh of the iFrame. Removing the reload had no effect, and in fact having it there stops the viewer from ever displaying. However, assigning a blank string to .src then the required url like this..
let url=...
let frame=document.getElementById("mf-360");
frame.src='';
frame.src=url;
..seems to work, but only every _second) time load360 is called.
Does anyone have any idea what's going on?? I'm more of an electronics-design/embedded guy and any help here would be most appreciated..
The site is https://www.davidcoils.com - click '360 Tours' at the top.
So I have developed a webpage containing some javascript and a couple of HighChart charts.
The page generally works great, every few seconds data is fetched from the server using an ajax request, and the chart is updated.
The issue happens when I have switched to a different tab for a few minutes and then want to go back. The page can take a very long time to show up. This happens on both Chrome and Firefox.
I couldn't really find out how the browser is handling javascript and page updates in non-active tabs, but it seems to be related at least.
Any ideas on how to improve the time it takes for the page to show?
To be perfectly clear, the page has no visible performance issues while it is the active tab.
So it turns out we froze highcharts just a couple of versions before this fix went in.
When we upgraded the version, everything worked great!
Many thanks to #WojciechChmiel for pointing me in the right direction.
I have a loading screen that is basically a modal over my index page. I only want it show up when a user comes to my site initially. The screen isn’t really important for functionality, but when things load on the index page, images and other things flicker around a bit depending on a few variables I can set using url params. I want to have a nice, clean user experience for the first load at least.
But after the first load, the loading screen gets annoying as it covers the homepage each time it is loading.
I have used document.referrer for the time being, so at least if the home menu button is clicked, I can detect that. But the issue I am facing is if a user uses the back button.
I thought about using local storage, but the issue with this would be that if a user is on my page, goes to another website and then comes back, I would like to start with the loading page again. If I set a session cookie that wouldn’t happen.
I’m thinking the best solution is to set a cookie that lasts for about 30seconds to a minute for each page visited. I can write the code to do that, and am not asking for help with that, I’m just wondering if there is a better way to do it.
I am new on add-on development using the SDK.
I want to ask you guys if it is possible to start my extension automatically after I open my browser? At the moment I starts after I press my widget icon in the toolbar (the panel shows a table with some data I get from the DOM).
Another thing I want to ask you: is it possible to show a loading screen (like a ajax gif) inside my panel (my extension needs a few seconds after switching a tab, to get the DOM data) every time I press the toolbar button.
First of all: One question per post, please.
Extensions are always started with the browser. When it comes to SDK add-ons, your main.js will be called. It's your job to perform any additional initialization form there.
Panels contain regular HTML pages and therefore can use images.
It's impossible to tell you more, without you providing more details and the code you got so far!
In my scenario, I'm linking to fairly large images (both in dimensions and filesize). It's understandable that fancybox will have to load for a few seconds before displaying them. The problem is that the loading animation is not showing up, so when the user clicks the thumbnail, it gives the impression that nothing is happening. Fancybox eventually comes up a few seconds later.
There is a secondary issue, also. The images are set to display as a gallery, via the "rel" attribute. Even when the user is viewing one image, browsing to the next takes a while (again, due to filesize), but because the throbber is not showing up, it seems like the prev/next buttons are not working. Any ideas?
I should add that I'm using fancybox v2.
My code (after including the necessary css and scripts for fancybox and the buttons helper, of course): http://pastebin.com/u3g8U8FS
Updating to the latest version (2.0.6) did the trick.
Make sure that the fancybox_loading.gif as well as the fancybox_sprite.png files are in the same folder as the jquery.fancybox.css file