Jon Glazer wrote:
Actually here's the function (saw some slight mistakes). Do you have any
ideas why its "blanking" on some IEs?
<script>
<script type="text/javascript">
function replacemain(id){
"id" is not a good choice for a variable name. I keep 'em simple:
function replacemain( s ) {
var pictemp=new Image();
Why create pictemp as an image, when you only need it as a string? You
can set its value at the same time and create a variable to hold the
reference to MainImage (keeps code neater...):
var x = document.images['MainImage'];
var y = document.images[s];
var pictemp = x.src;
if (document.all){
You repeatedly test for document.all, but don't use it. I guess the
presumption is that any browser that supports document.all also
supports filters - that's kinda risky. You want to use filters, so test
for them. Since you want to use it more than once, use a boolean:
var haveFilters = (x.filters);
if ( haveFilters ) {
document.images.MainImage.style.filter="blendTrans (duration=2)"
document.images.MainImage.filters.blendTrans.Apply ()
document.images['Image_'+id].style.filter="blendTrans(duration=2)"
document.images['Image_'+id].filters.blendTrans.Apply()
Because we've used simple variable names, this stuff now becomes:
x.style.filter = "blendTrans(duration=2)";
x.filters.blendTrans.Apply();
y.style.filter = "blendTrans(duration=2)";
y.filters.blendTrans.Apply();
}
pictemp.src=document.images.MainImage.src;
document.images.MainImage.src = document.images['Image_'+id].src;
document.images['Image_'+id].src=pictemp.src;
and swapping the images becomes:
x.src = document.images[s].src;
y.src = pictemp;
[...]
et cetera.
Now your function will happily work in IE and Firefox (at least it did
for me). I hope it also fixed your other issue! Sample code below:
<html>
<head><title>Swap Images</title>
<script>
function replacemain(s){
var x = document.images['MainImage'];
var y = document.images[s];
var haveFilters = (x.filters);
if ( haveFilters ) {
x.style.filter = "blendTrans(duration=2)";
x.filters.blendTrans.Apply();
y.style.filter = "blendTrans(duration=2)";
y.filters.blendTrans.Apply();
}
x.src = document.images[s].src;
y.src = pictemp;
if ( haveFilters ) {
x.filters.blendTrans.Play();
y.filters.blendTrans.Play();
}
}
</script>
</head><body>
<img src="a.gif" id="MainImage" width="200" height="50"
onclick="replacemain('notMainImage');">
<br>
<img src="b.gif" id="notMainImage" width="200" height="50">
</body></html>
--
Rob
