Emergency! Random image script not working – weird! Client MAD………

@dingbatqueenAug 13.2017

Hi friends! I’m working in Dreamweaver CC and have inserted and revised a random image script on an existing page. It works great when previewing from my desktop but it does NOT work after uploading to the server. I’ve tried everything I could think of and can’t make headway with it. The links to the images are good and they all work — just not with the script. The client is about ready to kill me (and not with kindness). 😮 Can anyone help? ? I’d be ever so appreciative!!

Here’s the link to the page where I used the script: ~~[URL=”http://decoymag.com/classifieds/classifi.htm”]~~http://decoymag.com/classifieds/classifi.htm[/URL]

The image, which changes upon reload/revisit, is supposed to be appearing belong the small ‘CLASSIFIEDS’ header and before the paragraph text which begins with “Following is a complete list of…”

Here’s a snippet of the script that I inserted into the page – perhaps you’ll see the problem right away? (Gee, I hope so!)

~~[COLOR=”#B22222″]~~<script language=”JavaScript”>
<!–

/*
Random Image Script- By JavaScript Kit (~~[url]~~http://www.javascriptkit.com[/url])
Over 400+ free JavaScripts here!
Keep this notice intact please
*/

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish
myimages[1]=”../advertisers/RJG/RJG1.jpg”
myimages[2]=”../advertisers/RJG/RJG2.jpg”
myimages[3]=”../advertisers/RJG/RJG3.jpg”
myimages[4]=”../advertisers/RJG/RJG4.jpg”
myimages[5]=”../advertisers/RJG/RJG5.jpg”
myimages[6]=”../advertisers/RJG/RJG6.jpg”

//specify corresponding links below
var imagelinks=new Array()
imagelinks[1]=”http://www.rjgantiques.com”
imagelinks[2]=”http://www.rjgantiques.com”
imagelinks[3]=”http://www.rjgantiques.com”
imagelinks[4]=”http://www.rjgantiques.com”
imagelinks[5]=”http://www.rjgantiques.com”
imagelinks[6]=”http://www.rjgantiques.com”

var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write(‘<a href=’+'”‘+imagelinks[ry]+'”‘+’ target=”new” ><img src=”‘+myimages[ry]+'” border=0></a>’)
}
random_imglink()
//–>
</script> [/COLOR]

Once again, THANK YOU MY FRIEND(S)!!!!

~~[I]~~— ‘ding[/I] 😮

to post a comment

JavaScript

5 Comments(s) _↴

@rootAug 13.2017 — #document.write has been defunct for along time now, the appropriate method is to have an <img> tag that is named, you then update that element with the image source data.

Search this forum and you will find image rotation / replacement / randomizing scripts available to hack in to your script.

You will find alot of outdated coding methods on JavaScript Kit as well as other script depositories.

A quick idea here

function rndImage( i ){
 vat r = Math.floor( Math.random() * i.length ) | 0;
 return i[ r ];
 }
 
 function updateTarget( ad ){
 // update the image
 var t = document.getElementById( "myImage" );
 t.src = ad.src;
 // update the link
 var a = document.getElementById( "myImageLink" );
 a.href = ad.href;
 }
 
 function changeImage(){
 var img = rndImage( adverts ); 
 update( img ); // update the image...    <br/>
 }
 
 adverts = [ {src:"../advertisers/RJG/RJG1.jpg", href:"http://www.rjgantiques.com},
 {src:"../advertisers/RJG/RJG2.jpg", href:"http://www.rjgantiques.com"},
 {src:"../advertisers/RJG/RJG3.jpg", href:"http://www.rjgantiques.com"},
 {src:"../advertisers/RJG/RJG4.jpg", href:"http://www.rjgantiques.com"},
 {src:"../advertisers/RJG/RJG5.jpg", href:"http://www.rjgantiques.com"},
 {src:"../advertisers/RJG/RJG6.jpg", href:"http://www.rjgantiques.com"} ];
 
 // set a timer to change the images every 30 seconds.
 et=setInterval("changeImage()",30000);

(untested)

Basically if you use an array of objects, you can store all information about that advert like the image, the links, the css, or modify the routines to hook and change alternative image elements or any special size required. I had a banner script that would modify the size of the banner to fit a set window.

So an element {src:"../advertisers/RJG/RJG5.jpg", href:"http://www.rjgantiques.com"} could have {src:"../advertisers/RJG/RJG5.jpg", href:"http://www.rjgantiques.com", height:150, width:500} and all you would need to do is apply them to the relevant objects.

Then in the page where you want the adver to show... put the appropriate HTML so that the script can hook and update the elements
[code=html]<a id="myImageLink" href="./"><img name="myImage" id="myImage" src=""></a>[/code]

So I suggest you have a look at other scripts in this site.

I would also suggest that you avoid Dreamweaver as it is very old and writes the wrong DOCTYPE as well as a load of bloat scripting that isn't needed these days, it is that which may be conflicting with other scripting, I always found it a PITA and spent more time editing out and chasing bugs because of DW than my own buggy scripting.

I moved on to an editor that is text base, WYSIWYG is fine but you have a notepad++ install and a web browser, you have the same sort of environment, meaning you have syntax highlighting and can test immediately in your chosen web browser and web browsers are much better these days at error reporting (in the console.log F12 open / closes) and tells you what went wrong and where.

@dingbatqueenauthorAug 15.2017 — #Hi! I have a question about these lines of code in your answer to my post:

[COLOR="#B22222"]// set a timer to change the images every 30 seconds.

et=setInterval("changeImage()",30000);[/COLOR]

I'm trying to have the image change (either random or sequentially) each time the page is refreshed. However, this coding seems like it's going to change according to a set time instead. Is that right? Also, I wonder how to make sure the browser displays at least one ad if the ad blocker is otherwise preventing it from being shown on the page. I discovered that when I turned off uBlock Origin, the image would load correctly and would cycle as I wanted it to. That's how it acts with the code presently, but if the ad blocker is turned on, there is no image displayng at all on the page.

This is all so confusing!

THANK YOU........ Karen

@rootAug 15.2017 — #If you have a set of static images, use the [B]localStorage[/B] object to store the information between pages so that your image can refresh and not load the same image over again.

The setInterval is an event timer that calls the function every 30 seconds as the parameters are the function as a string or as its object and the time in milliseconds.

If you were needing different display periods, then you would add to the image data a property that is going to set the time period to call the next refresh.

The question is are you looking to only change image on each page crefresh or are you looking for a script that shows all images in a sequence and starts again randomly on each page refresh?

@dingbatqueenauthorAug 15.2017 — #Thank you for explaining that!!!!

I am looking to change just one image on the page each time it's refreshed. The client has given me 5 ads and wants them to be different each time the page is visited. Honestly, just having them change on a page refresh, even if they are simply random, would be okay.

I discovered that one of my ad blockers (uBlock Origin) was preventing the ad from appearing when I tested it. After I removed all instances of the word 'ad' in the paths and image names, the ad started to appear and even changed on the page refresh. I had originally wanted a new page to load in the browser when the ad was clicked on but my popup blockers prevented that from working. It wasn't such a big sacrifice to simply let their website load in the same window and be done with it!

So far these changes seem to work and if the advertiser approves it, I'm ready to move on.

I've never been able to write my own scripts and it's been years since I've even modified one. I struggle with severe memory loss and I'm generally not able to learn anything new. And once a bit of information leaves my brain, it's gone forever. As you can imagine, it's been a struggle. I can't thank you enough for your time and your help, which is especially valuable to a person like me.

THANK YOU AGAIN....... ?

@rootAug 16.2017 — #First a test to see if HTML5's localStorage object is supported in your clients browser.

function supports_html5_storage(){
 try {
 return 'localStorage' in window &amp;&amp; window['localStorage'] !== null;
 } catch(e) {
 return false;
 }
 }

(c/o www.diveintohtml5.info )

This could be modified so that the check value is set when the page loads and JavaScript is available to the browser localStorageSupport = ('localStorage' in window && window['localStorage'] !== null) || false;

If local storage is not available then I suggest another alternative is to use the URL parameter to indicate between pages what advert has been shown previously, these methods can easily be found on this site using search or to search with your fave search engine the way to achieve the goal you seek.

So storing the chosen advert in localStorage will allow you read in on the next page load the previous advert, then in your random script, all you do is remove the element previously shown and then select at random an image to show, store that image number in the localStorage object to replace the previous value, then on page load the process is repeated.

Also in #JavaScript _↴

Click funciton don't work Page Turning Effect slightly tecknical problem, HELP!!!!

Success!

Help @dingbatqueen spread the word by sharing this article on Twitter...

Tweet This

Emergency! Random image script not working – weird! Client MAD………

5 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

Emergency! Random image script not working – weird! Client MAD………

5 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

5 Comments(s) _↴

Also in #JavaScript _↴