Animation in IE
ramndump - May 24, 2009 - 17:27
| Project: | slowtell |
| Version: | 5.x-1.0 |
| Component: | Code |
| Category: | bug report |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | needs review |
Description
The animated gif seems to not animate using IE6 or IE7. I have directed the browsers to the actual location of the files (http://www.example.com/sites/all/modules/slowtell/loading_animation.gif) and it loads and animates just fine in IE, but when you are using the module to display, it just shows img with no animation.
Also I noticed in IE6 the placement of Loading txt and gif is off. It loads in the title area of the page instead of the 40% region you have it set to load in.
#1
IE stops all executions once page loading is started, and hence all animations stops. Could you attach a screenshot for IE6 where output location wasn't correct?
#2
I have attached both a copy of firefox and IE6 img to notice the difference in the LOADING... positioning on the screen. I tested in IE 7 and positioning is correct on the page. Problem appears to be only IE6
#3
I had a problem with the GIF not animating in IE8.
After some searching I found this solution.
It 'restarts' the GIF with a delay and adds a timecode to the GIF file which forces IE to refresh the GIF. It seems to sort out the IE display issue.
I inserted this into slowtell.js at line 21 in the 'initon' function :
var pbar = document.getElementById("slowtell_image");if (pbar) {
setTimeout(function() { pbar.src = pbar.src + "?rnd" + new Date().getTime() }, 300);
}
my slowtell.js 'initon' function line 20-32 now reads like this :
function initon() {var pbar = document.getElementById("slowtell_image");
if (pbar) {
setTimeout(function() { pbar.src = pbar.src + "?rnd" + new Date().getTime() }, 300);
}
// this is not the best method... but still we don't have any other choice halt operation for a while
var currentTime = new Date();
var limit = currentTime.getTime() + Drupal.slowtell.delay*1000;
do {
currentTime = new Date();
}while(currentTime.getTime() < limit);
$('#slowtell_block').jqmShow();
}
and changed the slowtell.module file at line 211 from :
. '<img src="'.$image.'" class="slowtell_image" />'and change it to a ID not a CLASS.
. '<img src="'.$image.'" id="slowtell_image" />'This seems to work on Firefox 3, Safari 4 and IE 8