|
JavaScript - Script Skipping Image
I've got an old school script running a static slide show, but it's not showing the ninth image - regardless of what the image is (ruling out a typo in my image file).
Here's the page and script: http://www.agwprefinished.com/handpainted.asp Code: <SCRIPT LANGUAGE="JavaScript">
<!--
/*
Script by FPMC at http://jsarchive.8m.com
Submitted to JavaScript Kit (http://javascriptkit.com)
For this and 400+ free scripts, visit http://javascriptkit.com
*/
//set image paths
src = [ "images/faux-stone.jpg",
"images/dining-inlay.jpg",
"images/dining-inlay-detail.jpg",
"images/faux-inlaid-marble-limestone.jpg",
"images/faux-marble-inlay-manhattan.jpg",
"images/foyer-inlay.jpg",
"images/foyer-inlay-detail.jpg",
"images/weathered-grain-1.jpg",
"images/weathered-grain-detail.jpg",
"images/weathered-grain-2.jpg",
"images/weathered-grain-3.jpg",
"images/ebonized-oak.jpg",
"images/aged-oak.jpg",
"images/ebonized-oak-transition.jpg",
"images/sample.jpg",
"images/faux-marble-tile.jpg",
"images/faux-marble-tile-2.jpg",
"images/faux-marble-medallion.jpg",
"images/metallic-1.jpg",
"images/metallic-2.jpg",
"images/painted-pattern-bath.jpg",
"images/painted-pattern-detail.jpg",
"images/faux-parkay-4.jpg",
"images/faux-parkay-3.jpg",
"images/faux-parkay-2.jpg",
"images/border-stencil-1.jpg",
"images/border-stencil-2.jpg",
"images/monogram.jpg",
"images/dining-stencil.jpg",
"images/reproduction-border.jpg",
"images/reproduction-border-detail.jpg",
"images/reproduction-hall.jpg",
"images/inlay-pattern-hall.jpg",
"images/modello-samples-1.jpg",
"images/modello-samples-2.jpg",
"images/pavlosk-inlay-imitation.jpg",
"images/st-peter-inlay.jpg",
]
//set corresponding urls
url = [""]
//set duration for each image
duration = 4;
//Please do not edit below
ads=[]; ct=0;
function switchAd() {
var n=(ct+1)%src.length;
if (ads[n] && (ads[n].complete || ads[n].complete==null)) {
document["Ad_Image"].src = ads[ct=n].src;
}
ads[n=(ct+1)%src.length] = new Image;
ads[n].src = src[n];
setTimeout("switchAd()",duration*1000);
}
function doLink(){
location.href = url[ct];
} onload = function(){
if (document.images)
switchAd();
}
//-->
</SCRIPT>
Similar TutorialsHii guys.. Im pretty new to Javascript and cant get this working.. Code: <script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script>
</head>
<body>
<script type="text/javascript">
function checkIt(evt) {
evt = (evt) ? evt : window.event
var charCode = (evt.which) ? evt.which : evt.keyCode
if (charCode > 31 && (charCode < 48 || charCode > 57)) {
status = "This field accepts numbers only."
return false
}
status = ""
return true
}
function notEmpty(){
var n = document.getElementById('myText').value
if (n<100)
test1();
else if(n<200)
test2();
else
{alert("You did not enter a number!")}
}
return:false
$(function test1() {
{alert("1")}
});
$(function test2() {
{alert("2")}
});
</script>
<INPUT TYPE="text" NAME="numeric" onKeyPress="return checkIt(event)" id="myText">
<input type='button' onclick='notEmpty()' value='Form Checker' />
</body>
Hes running function test1 and function test2 straight without looking at the if else statment, what im doing wrong? Anyway thanks for helping me Greetz Lennard i know there are pre-made scripts to do what i'm doing. i want to create this myself to learn. i'm trying to create a list of section titles with arrows next to them, clicking on an arrow expands the section to read it's text, clicking on the arrow again collapses the section text. additionally, i would like an "expand all" and "collapse all" link and that's where my issue baffles me. my js - Code: function expandAll() {
var collapsedDivs = document.getElementsByClassName('collapsed');
for (var i=0; i<collapsedDivs.length; i++) {
var expandMe = collapsedDivs[i];
expandMe.style.display = 'block';
expandMe.addClassName('expanded');
expandMe.removeClassName('collapsed');
document.getElementById('arrow_'+i).innerHTML = '<img src="../media/hide.gif" />';
}
}
my html - Code: <div style="float:left" id="arrow_0"><img src="../media/show.gif" /></div><div style="margin-left:20px; text-align:left; font-weight:bolder; font-size:14px">SECTION ONE TITLE</div> <div class="collapsed" style="margin-left:20px; margin-right:30px; text-align:left; display:none">Section one text text text text text text text text text text text text text text text text text text text text text text </div> <div style="float:left" id="arrow_1"><img src="../media/show.gif" /></div><div style="margin-left:20px; text-align:left; font-weight:bolder; font-size:14px">SECTION TWO TITLE</div> <div class="collapsed" style="margin-left:20px; margin-right:30px; text-align:left; display:none">Section two text text text text text text text text text text text text text text text text text text text text text text </div> <div style="float:left" id="arrow_2"><img src="../media/show.gif" /></div><div style="margin-left:20px; text-align:left; font-weight:bolder; font-size:14px">SECTION THREE TITLE</div> <div class="collapsed" style="margin-left:20px; margin-right:30px; text-align:left; display:none">Section three text text text text text text text text text text text text text text text text text text text text text text </div> <div style="float:left" id="arrow_3"><img src="../media/show.gif" /></div><div style="margin-left:20px; text-align:left; font-weight:bolder; font-size:14px">SECTION FOUR TITLE</div> <div class="collapsed" style="margin-left:20px; margin-right:30px; text-align:left; display:none">Section four text text text text text text text text text text text text text text text text text text text text text text </div> upon executing the function, the result is the text for sections one and three being expanded and the arrows for one and two being changed. why? what am i doing wrong? Here's what I usually use and have been using for years and it works great, just not for this particular purpose. I don't have a clue when it comes to javascript. Code: <noscript><img src="no_script_quote.gif" width="406" height="94"/></noscript><script language="javascript">
var delay=6000
var curindex=0
var images=new Array()
images[0]="quote1.gif"
images[1]="quote2.gif"
images[2]="quote3.gif"
images[3]="quote4.gif"
images[4]="quote5.gif"
var preload=new Array()
for (n=0;n<images.length;n++)
{
preload[n]=new Image()
preload[n].src=images[n]
}
document.write('<img name="defaultimage" src="'+images[Math.floor(Math.random()*(images.length))]+'">')
function rotateimage()
{
if (curindex==(tempindex=Math.floor(Math.random()*(images.length)))){
curindex=curindex==0? 1 : curindex-1
}
else
curindex=tempindex
document.images.defaultimage.src=images[curindex]
}
setInterval("rotateimage()",delay)
</script>
But, now I want to be able to set a default picture to be shown first and have the random pics appear next. I also don't want the default pic to show up again in the random array. So basically, every time the page was first visited, or refreshed it would show the default picture then move into the random pics. Is there anyway to modify the code that I'm using to accomplish this? Or... Any help would be appreciated. Thanks, Dell Does anyone have a script, that can display a random image of the images I select?I'm going to use it for a type of captcha. I think this would be easier in javascript, so yes I am in the right section.
I want to make a script selecting electronics category in this site http://eu.redeem-it.net/boutique.php A friend told me to use getElementsByClass but I still cant do it. I'm trying to create a script that will allow me to shuffle a number of images saved in the same folder as the HTML file using the script, and then write them to the page. I have the whole script/page written out but it doesn't seem to be working and I can't divine why. If anyone could look at this code and tell me what's wrong with it I'd really appreciate it: Code: <html>
<head>
<title>dripppz</title>
<script language="JavaScript">
private function shuffle(a:Array):void {
for (var i:uint = 0; i < a.length; i++) {
var tmp:Object = a[i];
var randomNum:Number = Math.round(Math.random() * (a.length-1));
a[i] = a[randomNum];
a[randomNum] = tmp;
}
}
var Image:Array = ('dripppz1.gif', 'dripppz2.gif', 'dripppz3.gif', 'dripppz4.gif', 'dripppz5.gif', 'dripppz6.gif', 'dripppz7.gif', 'dripppz8.gif', 'dripppz9.gif', 'dripppz10.gif', 'dripppz11.gif', 'dripppz12.gif', 'dripppz13.gif', 'dripppz14.gif', 'dripppz15.gif', 'dripppz16.gif', 'dripppz17.gif', 'dripppz18.gif', 'dripppz19.gif', 'dripppz20.gif', 'dripppz21.gif', 'dripppz22.gif', 'dripppz23.gif', 'dripppz24.gif', 'dripppz25.gif', 'dripppz26.gif', 'dripppz27.gif', 'dripppz28.gif', 'dripppz29.gif', 'dripppz30.gif', 'dripppz31.gif', 'dripppz32.gif');
shuffle(Image);
trace(Image);
function showImages(){
document.write('<img src="'+Image[0]+'" />');
document.write('<img src="'+Image[1]+'" />');
document.write('<img src="'+Image[2]+'" />');
document.write('<img src="'+Image[3]+'" />');
document.write('<img src="'+Image[4]+'" />');
document.write('<img src="'+Image[5]+'" />');
document.write('<img src="'+Image[6]+'" />');
document.write('<img src="'+Image[7]+'" />');
document.write('<img src="'+Image[8]+'" />');
document.write('<img src="'+Image[9]+'" />');
document.write('<img src="'+Image[10]+'" />');
document.write('<img src="'+Image[11]+'" />');
document.write('<img src="'+Image[12]+'" />');
document.write('<img src="'+Image[13]+'" />');
document.write('<img src="'+Image[14]+'" />');
document.write('<img src="'+Image[15]+'" />');
document.write('<img src="'+Image[16]+'" />');
document.write('<img src="'+Image[17]+'" />');
document.write('<img src="'+Image[18]+'" />');
document.write('<img src="'+Image[19]+'" />');
document.write('<img src="'+Image[20]+'" />');
document.write('<img src="'+Image[21]+'" />');
document.write('<img src="'+Image[22]+'" />');
document.write('<img src="'+Image[23]+'" />');
document.write('<img src="'+Image[24]+'" />');
document.write('<img src="'+Image[25]+'" />');
document.write('<img src="'+Image[26]+'" />');
document.write('<img src="'+Image[27]+'" />');
document.write('<img src="'+Image[28]+'" />');
document.write('<img src="'+Image[29]+'" />');
document.write('<img src="'+Image[30]+'" />');
document.write('<img src="'+Image[31]+'" />');
}
</script>
</head>
<body bgcolor="#ffffff">
<script language="JavaScript">
showImages();
</script>
</body>
</html>
Hi, im wondering if anyone can help me, i have a random image script and it works fine, apart from when you click on the images they link to the right place but ALL go to _self I want [2],[3]and[6] to link to the places they are already linking to but _blank NOT _self, does anyone know how to do this, it would be a massive help :) Below is the code for the script i am using: Code: <script language="JavaScript">
function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish
myimages[1]="images/layout/bottom gallery.png"
myimages[2]="images/layout/bottom facebook.png"
myimages[3]="images/layout/bottom twitter.png"
myimages[4]="images/layout/bottom team.png"
myimages[5]="images/layout/bottom whats on.png"
myimages[6]="images/layout/bottom forum.png"
//specify corresponding links below
var imagelinks=new Array()
imagelinks[1]="gallery.html"
imagelinks[2]="http://www.facebook.com/tos.php?api_key=fcddbaae811ef62bf3c4fb2ac7b1fd07&next=http%3A//dailyphoto-1402445175.us-east-1.elb.amazonaws.com/dailyphoto/applications/buffer/id%3A1/pid%3A2828044108236222753/from%3Apublisher.attachment.own.image?ref=nf&v=1.0&canvas#/group.php?gid=87957825200&ref=ts"
imagelinks[3]="https://twitter.com/groundzereo"
imagelinks[4]="team.html"
imagelinks[5]="whatson.html"
imagelinks[6]="http://groundzero.forumotion.co.uk/"
var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" border=0></a>')
}
random_imglink()
//-->
</script>
Thanks in advance =) Hey all, I am trying to get a code instead of php to display a image from a questionaire results page; Say the url returns; http://localhost/Myoka2/myokaTestResults.php?img=7 the 7 will show score2.png... this works fine with php, here is the code <?php $total = $_GET['img']; if ($total < 7) $total = 1; elseif ($total < 13) $total = 2; elseif ($total < 18) $total = 3; elseif ($total < 20) $total = 4; ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Contact Form</title> <script src="rollover.js" type="text/javascript"></script> <link rel="stylesheet" href="http://dl.dropbox.com/u/25307673/myoka/myokaStyle.css" type="text/css" media="screen" /> </head> <body> <span style="color:#6A1E67;font: normal bold 12pt/14pt Arial, Helvetica, sans-serif;margin-left:140px;"> How stressed are you? <h3>SCORES</h3> </span> <img src="http://dl.dropbox.com/u/25307673/myoka/myokaStress/score<?php echo $total; ?>.png" alt="" /><br /> <a href="http://www.facebook.com/myoka.spas?sk=app_128953167177144" target="_blank"> <img src="http://dl.dropbox.com/u/25307673/myoka/myokaFanPage//lastMin.jpg" style="padding-left:0px; padding-top:5px; border:0px" alt="" /> </a> <br/> </body> </html> What i need is this in javascript so that it will work in a iframe :-) I'm building a website with scrolling images at the top, I managed to find some code which seemed to work fine but then when I uploaded it to the server there were suddenly huge gaps between the images. www.s-remy.com/B/index.html here's the code for the scrolling Code: <script type="text/javascript">
<!--
// ********** User Defining Area **********
data=[
["scroll1.png","",""],
["scroll3.png","",""]
// no comma at end of last index
]
imgPlaces=40 // number of images visible
imgWidth=50 // width of the images
imgHeight=81 // height of the images
imgSpacer=4 // space between the images
dir=0 // 0 = left, 1 = right
newWindow=0 // 0 = Open a new window for links 0 = no 1 = yes
// ********** End User Defining Area **********
moz=document.getElementById&&!document.all
step=1
timer=""
speed=50
nextPic=0
initPos=new Array()
nowDivPos=new Array()
function initHIS3(){
for(var i=0;i<imgPlaces+1;i++){ // create image holders
newImg=document.createElement("IMG")
newImg.setAttribute("id","pic_"+i)
newImg.setAttribute("src","")
newImg.style.position="absolute"
newImg.style.width=imgWidth+"px"
newImg.style.height=imgHeight+"px"
newImg.style.border=0
newImg.alt=""
newImg.i=i
newImg.onclick=function(){his3Win(data[this.i][2])}
document.getElementById("display_area").appendChild(newImg)
}
containerEL=document.getElementById("his3container")
displayArea=document.getElementById("display_area")
pic0=document.getElementById("pic_0")
containerBorder=(document.compatMode=="CSS1Compat"?0:parseInt(containerEL.style.borderWidth)*2)
containerWidth=(imgPlaces*imgWidth)+((imgPlaces-1)*imgSpacer)
containerEL.style.width=containerWidth+(!moz?containerBorder:"")+"px"
containerEL.style.height=imgHeight+(!moz?containerBorder:"")+"px"
displayArea.style.width=containerWidth+"px"
displayArea.style.clip="rect(0,"+(containerWidth+"px")+","+(imgHeight+"px")+",0)"
imgPos= -pic0.width
for(var i=0;i<imgPlaces+1;i++){
currentImage=document.getElementById("pic_"+i)
if(dir==0){imgPos+=pic0.width+imgSpacer} // if left
initPos[i]=imgPos
if(dir==0){currentImage.style.left=initPos[i]+"px"} // if left
if(dir==1){ // if right
document.getElementById("pic_"+[(imgPlaces-i)]).style.left=initPos[i]+"px"
imgPos+=pic0.width+imgSpacer
}
if(nextPic==data.length){nextPic=0}
currentImage.src=data[nextPic][0]
currentImage.alt=data[nextPic][1]
currentImage.i=nextPic
currentImage.onclick=function(){his3Win(data[this.i][2])}
nextPic++
}
scrollHIS3()
}
timer=""
function scrollHIS3(){
clearTimeout(timer)
for(var i=0;i<imgPlaces+1;i++){
currentImage=document.getElementById("pic_"+i)
nowDivPos[i]=parseInt(currentImage.style.left)
if(dir==0){nowDivPos[i]-=step}
if(dir==1){nowDivPos[i]+=step}
if(dir==0&&nowDivPos[i]<= -(pic0.width+imgSpacer) || dir==1&&nowDivPos[i]>containerWidth){
if(dir==0){currentImage.style.left=containerWidth+imgSpacer+"px"}
if(dir==1){currentImage.style.left= -pic0.width-(imgSpacer*2)+"px"}
if(nextPic>data.length-1){nextPic=0}
currentImage.src=data[nextPic][0]
currentImage.alt=data[nextPic][1]
currentImage.i=nextPic
currentImage.onclick=function(){his3Win(data[this.i][2])}
nextPic++
}
else{
currentImage.style.left=nowDivPos[i]+"px"
}
}
timer=setTimeout("scrollHIS3()",speed)
}
function stopHIS3(){
clearTimeout(timer)
}
function his3Win(loc){
if(loc==""){return}
if(newWindow==0){
location=loc
}
else{
//window.open(loc)
newin=window.open(loc,'win1','left=430,top=340,width=300,height=300') // use for specific size and positioned window
newin.focus()
}
}
// add onload="initHIS3()" to the opening BODY tag
// -->
I'm not very familiar with JavaScript so I can't find any issues with it. I've tried changing the imgspace value but it doesn't seem to work? I need a script and HTML code for an image effect like this: http://www.saksfifthavenue.com/main/...11947&ev19=1:2 Something very easy, if possible. Thanks.
Hello guys, I am a js noobie really, and am looking for something specific. I have googled for quite some time now looking for a script to randomize a list of images on refresh. For example, If I have 8 images in a line in this order 12345678, when I refresh, I would like them to go into a new random order - 84567321, or anything. What I have found are scripts to allow random new images to appear in place of a single image, which is as close as I have gotten. Does anyone know of a script that can do this, or know how to make one? I have looked everywhere, and can't seem to locate one. Any help is greatly appreciated. I have a banner ad with an image rotation embedded in a DIV. It works quite fine, but doesn't have required SEO info, ie: alt text. Here is the code that is working. Code: <div style="background-image: url(http://www.earthwindwater.com.au/banners/skiracersworld/banner-bg.png);height:148px;width:982px;border:0px;">
<div style="float:left;height:148px;border:0px;">
<a href="http://www.earthwindwater.com.au" target="_blank"><img border=0 align="absmiddle" alt="Earth Wind and Water Sports Action Cameras" src="http://www.earthwindwater.com.au/banners/skiracersworld/EWW-logo.png" /></a>
</div>
<div style="height:148px;border:0px;float:right;padding-right:415px; ">
<a id="imageurl" target="_blank" ><img id="Rotating1" border="0"></img></a>
<script language="JavaScript">
function RotateImages(Start)
{
var a = new Array("http://www.earthwindwater.com.au/banners/skiracersworld/Contour+.png","http://www.earthwindwater.com.au/banners/skiracersworld/LiquidImage.png","http://www.earthwindwater.com.au/banners/skiracersworld/ContourGPS.png", "http://www.earthwindwater.com.au/banners/skiracersworld/GoPro.png");
var c = new Array("http://www.earthwindwater.com.au/store/cameras/full-hd-cameras/contour", "http://www.earthwindwater.com.au/store/cameras/hd-cameras/impact-series-720p-mx-goggle-red", "http://www.earthwindwater.com.au/store/cameras/full-hd-cameras/contourgps", "http://www.earthwindwater.com.au/store/cameras/full-hd-cameras/gopro-hd-motorsports-hero");
var b = document.getElementById('Rotating1');
var d = document.getElementById('imageurl');
if(Start>=a.length)
Start=0;
b.src = a[Start];
d.href = c[Start];
window.setTimeout("RotateImages(" + (Start+1) + ")",5000);
}
RotateImages(0);
</script>
</div>
</div>
Now, I thought I would modify the code a little and include "Image Title" and "ALT Text" I am not much of a scripting genius, therefore my modifications don't work. Here is my modified code Code: <div style="background-image: url(http://www.earthwindwater.com.au/banners/skiracersworld/banner-bg.png);height:148px;width:982px;border:0px;">
<div style="float:left;height:148px;border:0px;">
<a href="http://www.earthwindwater.com.au" target="_blank"><img border=0 align="absmiddle" alt="Earth Wind and Water Sports Action Cameras" src="http://www.earthwindwater.com.au/banners/skiracersworld/EWW-logo.png" /></a>
</div>
<div style="height:148px;border:0px;float:right;padding-right:415px; ">
<a id="imageurl" target="_blank" ><img id="Rotating1" id="imagealt" id="imagetitle" border="0"></img></a>
<script language="JavaScript">
function RotateImages(Start)
{
var a = new Array("http://www.earthwindwater.com.au/banners/skiracersworld/Contour+.png","http://www.earthwindwater.com.au/banners/skiracersworld/LiquidImage.png","http://www.earthwindwater.com.au/banners/skiracersworld/ContourGPS.png", "http://www.earthwindwater.com.au/banners/skiracersworld/GoProHDHERO2.png");
var c = new Array("http://www.earthwindwater.com.au/store/cameras/full-hd-cameras/contour", "http://www.earthwindwater.com.au/store/cameras/full-hd-cameras/impact-series-hd-1080p-mx-video-goggle-white", "http://www.earthwindwater.com.au/store/cameras/full-hd-cameras/contourgps", "http://www.earthwindwater.com.au/store/cameras/full-hd-cameras/gopro-hd-hero2-motorsports-edition");
var e = new Array("Contour+", "Impact Series HD 1080p MX Video Goggle", "ContourGPS", "GoPro HD HERO2 Motorsport Edition");
var g = new Array("Contour+", "Impact Series HD 1080p MX Video Goggle", "ContourGPS", "GoPro HD HERO2 Motorsport Edition");
var b = document.getElementById('Rotating1');
var d = document.getElementById('imageurl');
var f = document.getElementById('imagealt');
var h = document.getElementById('imagetitle');
if(Start>=a.length)
Start=0;
b.src = a[Start];
d.href = c[Start];
f.alt = e[Start];
h.title = g[Start];
window.setTimeout("RotateImages(" + (Start+1) + ")",5000);
}
RotateImages(0);
</script>
</div>
</div>
Any ideas how I can get this to work Hi I am a complete novice with Javascript. I posted a question on another site as I want to show a series of 9 images in a random order - ie all 9 images but changing their order every time the page loaded. Someone responded with the following script: onload= function(){ var n, pic, A= [1, 2, 3, 4, 5, 6, 7, 8, 9];// replace integers with urls var pa= document.getElementById('image_set'); // reference the container element pa=mr('evalBlock') while(A.length){ pic=document.createElement('img'); n= Math.floor(Math.random()*A.length); pic.src= A.splice(n, 1); pa.appendChild(pic); } } However - I don't know how to put it into my pages to get it to work and they have not replied to my further query. I think I have to put something in the () after function, also, do the URLs have to be absolute and do they need enclosing in ' or ". Also what code do I then have to put on the page to call the image? Would anyone here be able to help? Many thanks Carol I don't know if this is possible, so I figured I'd ask a few gurus. I know it is possible to have an image change at a certain time of day, and it's also possible to have an image change by day, but is there a script to do both? What I want to do is have the first image show from 8am cst to 6pm cst mon-fri, it's our open sign for live chat. The the rest of the time have the second image. Is this possible with any type of script? Any help you can give is greatly appreciated! I have used the script I downloaded from here. I have 3 images to run through. Its all works, BUT! My images are 3072 x 2034 in size, and thats what comes up on the page when loaded. I set the var slideheight and width entries in the code for 500 and 500. It seems to not read the var statement. I would like to leave the orogical images as is, so when clicked on they load full size. Any ideas would be great. Hi all, Did some searching but couldn't find anything to help me. I'm looking for a simple quiz script - basically, there would be an image on the screen (would be great if it was randomly generated out of maybe 100 different choices). The visitor would then click on one of two buttons (this is the "quiz" part) answering a question about the photo which was displayed. The script then tells the visitor if they got the answer right or wrong and then loads a new image for them to try again. It would be great if the script could keep a "streak counter" based on how many images a visitors got correct in a row. So for example: Question: is this a cat or a dog? [random image of dog or cat] [button to answer dog] [button to answer cat] Would this be fairly easy to implement (is there something like this already around) or is it more complicated than that? Thanks a bunch in advance for any help you can give. Hi, I wonder if someone can help me. I'm building a site which has a random image generated on the page each time it loads. It does work at the moment, but I'd like it to be xhtml compliant. Currently the page loads the javascript from an external .js file, but it needs a line in the body of the page to make it work fully. This line is currently causing 15 errors when I try and validate it. The line is as follows: <script type="text/javascript">document.writeln('<td'+'><img src="'+xoxo[choice]+'"height=26 width=970 border=0 ><'+'/TD>');</script> Does anyone have any suggestions about how to make this line compliant? I'm a bit of a beginner, so any help would be greatly appreciated! Hi, I am working with a template I purchased that will loop a series of header images. I like to stop the image series from going back to the beginning once the series of images cycles through. For instance, if there were 3 images in the sequence; currently the script cycles through all 3 images and then starts from the beginning. I would like the script to stop on the last image (so that image stays displayed) and not start the sequence again from the beginning. I couldn't get any support for hacking this script from the developers. The php file that handles this operation attached below and i was told by the support forum I posted in that some Javascript skill would be needed, hence the reason for posting in this section of the forum. Thanks for looking |
|||||||