View Full Version : Script doesn't work in FireFox

01-01-2010, 09:41 PM
1) Script Title: Live Background Previewer Script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex3/document1.htm

3) Describe problem: This script works fine in IE, but the script doesn't work in FireFox (version 3.5.6). Not the demo on DD and not on my own page.

Just wanted to point that out. Or unless I need a specific plugin to let it work? If so, that might be useful to put that on the script page.

This script has the same problem as mentioned above:
-:: Gradient Bar (http://www.dynamicdrive.com/dynamicindex11/gradient.htm)

01-02-2010, 05:46 AM
Neither of those scripts is rated for Firefox. So this is not a bug. But, instead of move this thread to the general help area, because they are both rated for Opera, and do not work in that browser, I'm leaving it here.

Here's the fix for Opera (also now works in Firefox):

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
#theImages {
overflow: hidden;
#theImages br {
clear: left;
#theImages img {
cursor: pointer;
float: left;
display: block;
<!--[if lt IE 6]>
#theImages img {
cursor: hand;
<script type="text/javascript">

Live Background Previewer Script-
Dynamic Drive (www.dynamicdrive.com)
For full source code, installation instructions,
100's more DHTML scripts, and Terms Of
Use, visit dynamicdrive.com


function tile(e, source){
e = e || window.event;
e.cancelBubble = true;
source = e.target || e.srcElement;
if(source.tagName && source.tagName.toLowerCase() === 'img'){
document.body.style.backgroundImage = 'url(' + source.src + ')';

function restore(){
document.body.style.backgroundImage = '';

function init(){
addEvent(document, 'click', restore);
addEvent(window, 'load', function(){
addEvent(document.getElementById('theImages'), 'click', tile);


return window.addEventListener? function(el, ev, f){
el.addEventListener(ev, f, false);
} : window.attachEvent? function(el, ev, f){
el.attachEvent('on' + ev, f);
} : function(){return;};
<span id="theImages">
<img src="backgr10.jpg" alt="">
<img src="backgr11.jpg" alt="">
<img src="backgr13.jpg" alt="">
<img src="backgr14.jpg" alt="">