Adding Rotating Java Script to my WP blog creates havoc in Safari Browser

It is probably because you are outputting an empty width= and height= and here:

document.write('<img src=\"' + banner + '\" width=')
document.write(width + ' height=' + height + ' ');

Why not use something like AdRotator though? I would think you would want something that could keep stats of click through’s although I don’t know if that particular plugin can so just try googling or something like wordpress banner plugin.

Thanks for replying jaseone.

I tried playing with the height and width settings, but it only changed the size of my banners instead of rectify the problem. I also took a serious look at ADROTATOR and I’m sorry to admit it was WAY over my head. Perhaps it would have been wiser for me to say I have nearly ZERO coding abilities. (I’m a poet, not a coder, but I’ve learned a lot from y’all and tinkering with code and such.)

To recap: the simple java code I’m using works fine in FIREFOX, okay in Internet Explorer (sometimes the ad simply isn’t there), and lousy in Apple’s Safari.

I can forget IE for now, since I’m most concerned about getting Safari to work. One thing that occurs to me is that if my java code is bad, it should fsck up all WP sites in Safari. But I’ve got one working fine:

https://www.macliberals.com/saucyblog/

So that gives me an idea. What I’ll do is post the header.php code of a WP blog where the java code works fine as is, and one that doesn’t. Maybe someone awesome like yourself might catch a meaningful difference– if any:

HERE’S THE CODE OF THE WP BLOG WHERE THE CODE PLAYS NICE TOGETHER (MANJI2):

https://www.macliberals.com/v-web/bulletin/bb/viewtopic.php?p=10147#10147

AND HERE’S A WP BLOG – (RANDOM-IMAGE THEME BASED ON KUBRICK)– WHERE ALL HELL BREAKS LOSE IN SAFARI:

https://www.macliberals.com/v-web/bulletin/bb/viewtopic.php?p=10148#10148

AND THIS IS A PICTURE OF WHAT THE BROKEN SITE LOOKS LIKE:

https://www.macliberals.com/temp/bleeding.jpg

******HOPING THIS HELPS********THANKS TO ANY BRAVE SOULS WHO LEND A HAND*****

??

Here’s proof that this code works fine by itself in any browser:

https://www.macliberals.com/test.html

(what I mean to say: I used this page as a test, and it works fine in any browser)

It would be much easier if you linked to the actual sites so we could see what was happening ourselves.

The Javascript you have though isn’t designed to be placed within the HEAD tags, it should be the very first thing after the BODY tag.

Hi Again Jaseone,

I appreciate your efforts here.

1. I’ve seen this code on two sites. I can’t find the original sight (arggh) but the second one screams at the top of it’s iLungs that the code belongs in the head:

https://www.designerwiz.com/JavaScripts/bannereffects/single_banner_rotator_on_refresh.htm

But, to be helpful, I tried it in the BODY tags JUST as you mentioned. I also tried it all over the body tag. It only worked on one spot– across the exiting banner– and as such is useless to me.

2. I can’t put the destroyed site up because it’s an active site. I’ve posted the defective code AND illustrated what goes wrong. Do you really need to see it or do you need to see the source code?

Hmm I wonder if it might have to do with the missing semi-colon at the end of this line …

document.write('<img src=\"' + banner + '\" width=')

@theoneandonly
I can help you with AdRotator Plugin. I wrote it. It doesn’t require you to do any coding.

All you need to do is create a text file in wp-content directory with one line per ad (works with adsense too). Then add a single line to your template where you want the ads to be displayed.

The manual provides full details.

Please comment on the blog entry to get faster response.

BTW: As a small added benefit this plugin will work with all versions of all browser and operating systems – guaranteed ??

Javascript doesn’t require semi-colons to ternminate lines but it is good practice to use them.

I still think it is the height/width thing, try doing:
Change:
document.write('<img src="' + banner + '" width=')
to:
document.write('<img src="' + banner + '"')

and change:
document.write(width + ' height=' + height + ' ');
To:
document.write(' ');

I don’t know why they say to put it in the header as it is outputting HTML and hence creating invalid HTML.

Still I suggest going with angusman’s plugin. ??

NyteOwl: didn’t work, but thanks for trying.
Jaseone: tried those adjustments as well. No good.

I EVEN TRIED: booting up in a test environment, to make sure my Safari wasn’t somehow clinging to old cache despite my dumping it repeatedly.

FOR THOSE WHO WISHED TO THE SEE THE SITE DAMAGED IN SAFARI: I’ll leave it malfunctioning for a few hours so you can see it.

Thanks all for your help.

What site is that?

btw the script tag should be:

<script type="text/javascript">

for XHTML, that may or may not be causing a problem.

and if the site is AppleSaucy then you have a lot of validation problems that could and probably are causing rendering problems as well:

Validation results

“What site is that?”

DOH!

https://www.macliberals.com/

(Sorry Jasone!)

— btw the script tag should be: <script type=”text/javascript”> —

Forgive me, but I don’t understand what that replaces or where it goes. I could guess but I might as well ask directly.

Also, I get nothing when I click on ‘validation results’.

JUST WHEN YOU THOUGHT IT COULDN’T GET ANY WORSE DEPT:

I was trying to install the Random Ad Generator discussed above. Manually. So I uploaded a folder called Random-Images. Then I learned I didn’t have to do this manually. And so I went back and deleted it.

As it turns out, the theme of my troubled site is called ‘Random-Banner’. I’ll give you one guess which folder I just deleted…

SIGH.

(BACKUPS: I have backups galore of my other two blogs. This one? Murphy’s Law. My host should be able to provide a backup, but if you find I can’t try ideas being suggested, now you know why…)