JavaScript - Slideshow Code Question (easy)

This is javascript that turns your current url into a tinyurl. How would I go about getting this to open into a new tab instead of the same tab?

Code:

javascript:void(location.href='http://tinyurl.com/create.php?url='+encodeURIComponent(location.href))

hi guys,

l am trying to learn javascript, although certain things seem to be easy to understand, l still have plenty of questions.

so l was reading some articles on w3schools and l was an interesting table about operations.

http://i1087.photobucket.com/albums/...kesnosense.png

if you check above's table you will see at the increment section as well decrement , you will see that in some cases the x and y dont have the same value, now l was just wondering, what is the difference between x=++y and x=y++ ?

I know it's possible to do this in php, but what would the javascript equivalent be?

Code:

var scripts = new Array();
scripts[] = "PHP";
scripts[] = "ASP";
scripts[] = "JavaScript";
scripts[] = "HTML";

But this obviously doesn't work. And just to clarify, I mean the ability to add an array whenever I want to in my page instead of having to name the array like...
Code:

var scripts = new Array();
scripts[0] = "PHP";
scripts[1] = "ASP";
scripts[2] = "JavaScript";
scripts[3] = "HTML";

I'm using it for such as in a form:
Code:

<input type="text" name="formarray[]">
<input type="text" name="formarray[]">

Thank you in advance.

I have been searching through the forums and have not been able to find exactly what I am looking for.

I built my web site a while back using Flash. Right now I am trying to convert it to a non-Flash site.

I am trying to duplicate my slideshow, with a caption, and forward/back button in javascript. If anyone can offer advice on how to do this I would greatly appreciate it.

my current flash site: http://moparch.com/moparch/architecture/msbe/msbe.html

Thanks in advance.

P.S.
I am brand new to javascript. My experience is limited to the few online tutorials that I have worked through.

I was planning on using Dreamweaver (which I am already familiar with) to assemble the final site once I get the necessary javascript figured out.

Help me anyone I am completely stuck. If you do this I shall build a shrine in your honour.

In the following code the 'for' loop gets data from the relevant tags of an XML file, then puts them into the 'txt' variable. It then moves onto the next record in the XML file and does the same thing. However, I don't want the contents of txt to be overwritten each time the code loops through each record. Instead I want it to add to txt, then loop around and add the new contents of txt to the previous contents of txt. I tried txt = txt + artist + title + year; but this didn't work. Can anyone explain how to do this? Please note the contents of the variables are strings of text not numbers.

Code:

x=xmlDoc.getElementsByTagName("CD");
i=0;

function displayCD()
{
for (var i=0;i<x.length;i++)
{
artist=(x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue);
title=(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
year=(x[i].getElementsByTagName("YEAR")[0].childNodes[0].nodeValue);
txt= "Artist: " + artist + "<br />Title: " + title + "<br />Year: "+ year;
}
document.getElementById("showCD").innerHTML=txt;
}

hi guys, l am currently studying web technologies on a part time basis, and learning javascript.

l got a very useful website, but still l dont understand certain things like this one:

Quote:

When a function has performed an assignment, it may provide a value that other functions would need, for any reason you judge necessary. When a function produces a value an makes it available to other functions, such a function is said to return a value.

To define a function that returns a value, just before the closing curly bracket, type the return keyword followed by the value that the function returns. The value should be a valid and expected type. Because JavaScript is not a type-checking language, meaning it hardly checks anything you are doing, it is your responsibility to make sure that your function returns the right value.

Here is a function that returns a value:

function rectangleArea(length, height)
{
var area;
area = length * height * 3.14159;
return area;
}

Even if a function returns a value, it can still be called like any other function. If a function returns a value, its name can be assigned to a variable to give a value to, or change the value of, the variable. Here is an example:
Code:

<Script Language="JavaScript">
function rectangleArea(length, height)
{
  var area;
  area = length * height * 3.14159;
  return area;
}
function displayArea()
{
  var l, h, rectArea;
  l = 52.05;
  h = 46.55;
  rectArea = rectangleArea(l, h);
  document.write("The area of the is ", rectArea);
}
</Script>

<Script Language="JavaScript">
  displayArea();
</Script>

what l understand from the code is, l have 2 functions, first function is a return function and has got a value, but where is this value going? l mean what's happing with it? l mean l cant see this return value in the second function, why? l ma also not understand why we need to have 2 functions, why not just 1 ?/?? can someone explain me one by one the lines maybe?

thanks

Was wondering if someone could help me quickly, i'm have a strange issue with a slideshow i have built in javascript. The slideshow works fine until you add any other image onto the page like a banner or anything. As soon as you do that when you click next on the slideshow that image or banner with change to the next picture instead of the desired image if that makes any sense...

Would appreciate any help, thank you!

here is the link to my practice website, so you can see what is going on pretty new to all of this..


http://dpetersen.net46.net/advancedw...l.html?agree=0

Hi everyone,

I am a newbie Javascript programmer. I have gotten better lately and am starting creating scripts from scratch to test my knowledge.

I wrote the script below and needless to say, it does not work... yet. I know I am not far and I need someone's help to tweak my script and let me know what was wrong with.

That would be greatly appreciated. Anyone?

I have this div in the middle of a page which has an image. I want the image.src to switch to the next image every 3 seconds.

Here's my html code:

Code:

<body>

<div id="slideShow">
	<img src="pic3.jpg" id="image" />
</div>

</body>

Here's my js code:
Code:

window.onload = initLoad;




function initLoad()
{
// Create a new image object 
oImage = new Image;
// tie the object image object with your target id in your html code
oImage = document.getElementById("image");

//Create a new date object
var oCurrDate = new Date();

// Create a new time object
var oCurrentTime = oCurrDate.getSeconds();

//Loop through all images in the document
for(var i=0; i<document.images.length; i++)
{
	//the current image remains so as long as 3 seconds or less have passed
	while(oCurrentTime <= oCurrentTime + 3)
	{
		// if 3 seconds have not passed, your current picture remains on the screen
		oImage.src = document.images[i].src;
		
	}
}					
}

Any idea why this doesn't work?

I'm trying to hide the li with ID of facebook1 if the innerHTML is one of two things. But if both return false and there is more code in there (e.g. a full url), I want to show the li with ID of facebook1 and also add the text 'Facebook Profile' to the span with ID of fbook-add.

Code:

<ul>
   <li id="facebook1"><a href="http://facebook.com"><span id="fbook-add"></span></a></li>
</ul>

<script type="text/javascript">
if(document.getElementById('facebook1').innerHTML.toLowerCase()=='<a href="http://"><span id="fbook-add"></span></a>')
{
	 document.getElementById('facebook1').style.display='none';
}
else if(document.getElementById('facebook1').innerHTML.toLowerCase()=='<a href=""><span id="fbook-add"></span></a>')
{
	 document.getElementById('facebook1').style.display='none';
} else
{
	 document.getElementById('fbook-add').innerHTML=='Facebook Profile';
}
</script>

I need to change the source of an image but I can't seem to figure out how. I believe that I have the correct syntax, but it does not seem to be working. Maybe I am typing it in wrong or something.

I try to test my javascript by typing the script: <strong>javascript:document.getElementById('img1').src='./images/image1.jpg';</strong> into the address bar. Nothing happens.

I also try to test it out by putting this on the page, but once again, nothing happens.
Code:

<script type="text/javascript"><!--
document.getElementById('im1').src="./scripts/'.$upload_image.'";
//--></script>

This is what my HTML code looks like:
Code:

<img src="./images/temp_wizard_picture.gif" alt="" style="padding:4px; background:#fff; border:1px #bbb solid;" id="img1" />

Can somebody please fill me in on what I am doing wrong. Thank you.

Is there a way to have the websites open in new windows? I've tried the standard ways, but script doesn't work when I change it. Does anyone know what and where in the script I can add for opening in new windows. Thank you
The script is shown on this page:
http://www.javascriptkit.com/script/cut181.shtml

Hi

I'm trying to get a slideshow working but the timings are all over the place.

I can make it loop through once, neatly, but thereafter the timings seem to out - I have a loop set up to run five times.

I think this is because the function is incrementing the delay values or something along those lines (I know there's a neater way to write this but I'm just starting out).

Code:

 function slideWinder () {

var x = 1

for (var x = 1; x < 5; x++) {

$('#slideone').delay(0).fadeIn(0).delay(2000).fadeOut(400);

$('#slidetwo').delay(2000).fadeIn(400).delay(2000).fadeOut(400);

$('#slidethree').delay(4000).fadeIn(400).delay(2000).fadeOut(400);

$('#slidefour').delay(6000).fadeIn(400).delay(2000).fadeOut(400);

$('#slidefive').delay(8000).fadeIn(400).delay(2000).fadeOut(400);

$('#slidesix').delay(10000).fadeIn(400).delay(2000).fadeOut(400);

}

}

I need someone to make a small modification to this javascript code:
<script type = "text/javascript">

function hyperlink()
{

var url = (location.href)
url = url.replace(/\.(html)/i, "_2.html")
window.location.href = url;
}

</script>


Here is the situation:
On this webpage:
http://tehcake.com/video/30rock/2x14%20-%20Copyx.html
where it says "Backup Links 1 2", if you click on the "1" in "Backup Links 1 2"

it goes to this webpage, which is what it is supposed to do:
http://tehcake.com/video/30rock/2x14%20-%20Copyx_2.html

However, on this webpage, where it says "Backup Links 1 2", if you click on the "1" in "Backup Links 1 2" it leads to a non existing page by adding an extra "_2" to the end of the file name.

Anyways, I need a way to modify this code (same one as above):
<script type = "text/javascript">

function hyperlink()
{

var url = (location.href)
url = url.replace(/\.(html)/i, "_2.html")
window.location.href = url;
}

</script>
This script subtracts ".html" and adds "_2.html" to the URL.
Anyways, i need to change it

so that if the filename has an _2.html in the file name, like in this URL:
http://tehcake.com/video/30rock/2x14%20-%20Copyx_2.html

the script would not add an extra _2 to the URL, instead it would just link to the same page.

I dont know much about javascript so I need help to make this change.

Hi I'm not a programmer if someone could help me fix this it would be great thanks.

here is the code I found a while ago.

Code:

<!-- SUBMENU ROLLOVER SCRIPT -->
<script type="text/javascript"> 
window.onload=function () { setStyles(); };  
function setStyles() {  
 ids = new Array ('contentMenu1','contentMenu2','contentMenu3','contentMenu4');  
 for (i=0;i<ids.length;i++) {  
  document.getElementById(ids[i]).className='notactive';  
  document.getElementById(ids[i]).onclick=function() { return CngClass(this); }  
 }  
}  
function CngClass(obj){  
 var currObj; 
 for (i=0;i<ids.length;i++) { 
  currObj = document.getElementById(ids[i]); 
  if (obj.id == currObj.id) {  
  currObj.className=(currObj.className=='notactive')?'active':'notactive';  
  } 
  else { currObj.className='notactive'; } 
 } 
//return false;
}  
</script>
<!-- END SUBMENU ROLLOVER SCRIPT -->

and the html is here

Code:

<ul class="contentMenuContainer">
<li id="contentMenu1" class="notactive"><a href="javascript:ajaxpage('aj-wildlife.html', 'homeInfo');" onClick="setStyles('contentMenu1');" >wildlife</a></li> 
<li id="contentMenu2" class="notactive"><a href="javascript:ajaxpage('aj-solitude.html', 'homeInfo');" onClick="setStyles('contentMenu2');">solitude</a></li>
<li id="contentMenu3" class="notactive"><a href="javascript:ajaxpage('aj-theboat.html', 'homeInfo');" onClick="setStyles('contentMenu3');">the boat</a></li>
<li id="contentMenu4" class="notactive"><a href="javascript:ajaxpage('aj-hosts.html', 'homeInfo');" onClick="setStyles('contentMenu4');">your hosts</a></li>
</ul>

OK so all I need is to know how to set a list item to be class="active" by default. I tried setting it to "active" but the script must reset them all to "notactive".

Sorry for being such a noob. Any help is greatly appreciated.

thanks

I found the code for how to create a basic slideshow on javascript kit. It tells you the code for 3 images. I am adding more images to my slide show, but when I go to preview it, it loops through the first 3 pictures only. Is there something else I need to change in order to get it to loop through all my pictures?

Here is the code I got from the site:
<html>
<head>
<script type="text/javascript">
<!--
var image1=new Image()
image1.src="firstcar.gif"
var image2=new Image()
image2.src="secondcar"
var image3=new Image()
image3.src="thirdcar.gif"
//-->
</script>
</head>
<body>
<img src="firstcar.gif" name="slide" width="100" height="56" />
<script>
<!--
//variable that will increment through the images
var step=1
function slideit(){
//if browser does not support the image object, exit.
if (!document.images)
return
document.images.slide.src=eval("image"+step+".src")
if (step<3)
step++
else
step=1
//call function "slideit()" every 2.5 seconds
setTimeout("slideit()",2500)
}
slideit()
//-->
</script>
</body>
</html>

My code looks like this:

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
<!--
var image1=new Image()
image1.src="Model01.jpg"
var image2=new Image()
image2.src="Model02.jpg"
var image3=new Image()
image3.src="Model03.jpg"
var image4=new Image()
image4.src="Model04.jpg"
var image5=new Image()
image5.src="Model05.jpg"
var image6=new Image()
image6.src="Model06.jpg"
var image7=new Image()
image7.src="Model07.jpg"
var image8=new Image()
image8.src="Model08.jpg"
var image9=new Image()
image9.src="Model09.jpg"
var image10=new Image()
image10.src="Model10.jpg"
var image11=new Image()
image11.src="Model11.jpg"
var image12=new Image()
image12.src="Model12.jpg"
var image13=new Image()
image13.src="Model13.jpg"
var image14=new Image()
image14.src="Model14.jpg"
var image15=new Image()
image15.src="Model15.jpg"
var image16=new Image()
image16.src="Model16.jpg"
var image17=new Image()
image17.src="Model17.jpg"
var image18=new Image()
image18.src="Model18.jpg"
var image19=new Image()
image19.src="Model19.jpg"
var image20=new Image()
image20.src="Model20.jpg"
//-->
</script>

<title>Untitled Document</title>
</head>

<body>
<img src="file:///K|/Michaels Homes Web/Images/Model01.jpg" name="slide" width=500 height=375>
<script type="text/javascript">
<!--
//variable that will increment through the images
var step=1
function slideit(){
//if browser does not support the image object, exit.
if (!document.images)
return
document.images.slide.src=eval("image"+step+".src")
if (step<3)
step++
else
step=1
//call function "slideit()" every 3.0 seconds
setTimeout("slideit()",3000)
}
slideit()
//-->
</script>
</body>
</html>

This is just the code for the slideshow, not any of the code from the rest of my website. It does the same thing when I test it either the code only or the whole webpage.

If I am missing something in the steps, please let me know.
Thanks