JavaScript - Javascript Works Fine In Firefox, But Not In Ie8, Any Ideas?

Code:

function toggle(div_id) {
	var el = document.getElementById(div_id);
	if ( el.style.display == 'none' ) {	el.style.display = 'block';}
	else {el.style.display = 'none';}
}
function blanket_size(popUpDivVar) {
	if (typeof window.innerWidth != 'undefined') {
		viewportheight = window.innerHeight;
	} else {
		viewportheight = document.documentElement.clientHeight;
	}
	if ((viewportheight > document.body.parentNode.scrollHeight) && (viewportheight > document.body.parentNode.clientHeight)) {
		blanket_height = viewportheight;
	} else {
		if (document.body.parentNode.clientHeight > document.body.parentNode.scrollHeight) {
			blanket_height = document.body.parentNode.clientHeight;
		} else {
			blanket_height = document.body.parentNode.scrollHeight;
		}
	}
	var blanket = document.getElementById('blanket');
	blanket.style.height = blanket_height + 'px';
	var popUpDiv = document.getElementById(popUpDivVar);
	popUpDiv_height=200
	popUpDiv.style.top = popUpDiv_height + 'px';
}
function window_pos(popUpDivVar) {
	if (typeof window.innerWidth != 'undefined') {
		viewportwidth = window.innerHeight;
	} else {
		viewportwidth = document.documentElement.clientHeight;
	}
	if ((viewportwidth > document.body.parentNode.scrollWidth) && (viewportwidth > document.body.parentNode.clientWidth)) {
		window_width = viewportwidth;
	} else {
		if (document.body.parentNode.clientWidth > document.body.parentNode.scrollWidth) {
			window_width = document.body.parentNode.clientWidth;
		} else {
			window_width = document.body.parentNode.scrollWidth;
		}
	}
	var popUpDiv = document.getElementById(popUpDivVar);
	window_width=window_width/2-150;//150 is half popup's width
	popUpDiv.style.left = window_width + 'px';
}
function popup(windowname) {
	blanket_size(windowname);
	window_pos(windowname);
	toggle('blanket');
	toggle(windowname);		
}

I have know much about javascript, but the code above works fine in safari and firefox but not IE.

it's for a popup, when you click a link it blankets the page and theres a popup window.

here's other parts of supporting css/php

Code:

<?php

 if(!$_POST['submit'] == 'login'){
      echo "<div id=\"blanket\" style=\"display:none;\"></div>\n";
	  echo "<div id=\"popUpDiv\" style=\"display:none;\">\n";
	  echo "<div id=\"loginform\">\n";
	  echo '<div id="close">';
	  echo "<a href=\"#\" onclick=\"popup('popUpDiv')\">\n";
	  echo '<img src="images/login/close.png" border="0">';
	  echo "</a>\n";
	  echo '</div>';
	  echo '<div class="clear"></div>';
	  echo "<form name=\"login\" method=\"post\" action=\"#\">\n";
	  echo "<div id=\"usernametext\">Username</div>\n";
	  echo "<input name=\"username\" type=\"text\" id=\"usernameinput\">\n";
	  echo '<div class="clear"></div>';
	  echo "<div id=\"passwordtext\">Password</div>\n";
	  echo "<input name=\"password\" type=\"password\" id=\"passwordinput\">\n";
	  echo '<div class="clear"></div>';
	  echo '<div id="loginsubmit"><input type="submit" name="submit" value="Submit"></div>';
	  echo "</form>\n";
	  echo "</div>\n";
	  echo "</div>\n";
	  echo "<span class=\"login_text\"><a href=\"#\" onclick=\"popup('popUpDiv')\">LOG IN</a></span>\n";

?>

Code:

#blanket {
background-color:#000000;
opacity: 0.40;
filter:alpha(opacity=40);
position:absolute;
z-index: 10;
padding:0;
top:0;
right:0;
left:0;
bottom:0;
width:100%;
height:100%;
margin:0 0 0 0;
}


#popUpDiv {
position:absolute;
background-color:#FFFFFF;
width:280px;
height:135px;
z-index: 10;
}

any help would be VERY much appreciated.

thanks

Hi
I am not really sure where to start with this as my function works perfect in IE 6. However when I select one of my categories and hit submit in Firefox or IE7 or 8 nothing happens. No error message. Just nothing. How can I get this working for firefox and IE7/8?

Code:

<script language="JavaScript">
var categories=[];
var categorieslist=[];
var thecategories=[];
var ItemDetails=[];
var selDate=[];
var content=[];
var imagePaths=[];
var art=[];
var aTheDates=[];
var aTheYear=[];
var catDM=" ";
var catUrl="";
var startposition=0;
var theImage="";
var pageDectect=0;
var thepage=0;
var pc=0;
var starty=0;
var pagenumber=0;
var filteredlist="<ul class='press-items'>";
function changeFilter(){
var selCategory=document.getElementById("browsetopic").value;
//alert(selCategory + " aha");
var selYear=document.getElementById("browseyear").value.substring(2,4);
var selMonth=document.getElementById("browsemonth").value;
//var selDate=document.getElementById("browsemonth").value + "/" + document.getElementById("browseyear").value.substring(2,4);


//alert(pagenumber);
for(pagenumber;pagenumber<art.length;pagenumber++){
//alert(selDate + "=" + aTheDates[pagenumber]);
//alert(selYear + "=" + aTheYear[pagenumber]);
//alert(selCategory + "=" + categories[pagenumber]);

	if(((selCategory=="nofilter"||categories[pagenumber]==selCategory))&&(selYear==aTheYear[pagenumber]||selYear=="00")&&(selMonth==aTheDates[pagenumber]||selMonth=="00")){
		filteredlist=filteredlist+art[pagenumber];	
	}
}
filteredlist=filteredlist+"</ul>";
//alert(filteredlist);
document.getElementById("theid").innerHTML=filteredlist; 
filteredlist="<ul class='press-items'>";
pagenumber=0;      
}

</script>

And the button

Code:

<a href="javascript:changeFilter();"><img style=" float: left;  margin-top: 0px;" class="submit" src="/images/submit.gif" /></a>

Hello,

I'm a novice with java script and I can't figure out why my script will work locally, but not live. Here is the link.

http://www4.uwm.edu/recsports/

There is supposed to be a rotating slideshow in the header, but it's just a black box.

Thanks!

I'm using the Javascript Tabifier (found he http://www.barelyfitz.com/projects/tabber/) on a new website I'm building.

Here is the test page I've been trying it out on: http://www.myohmomma.com/test-2

It seems to be working well in IE, but doesn't even appear in Firefox. Any idea why?

Additionally, there seem to be some positioning issues when I view it in Firefox, which I'm thinking is a topic for the CSS forums, but I thought could be relevant to my issue, somehow.

I don't want to overwhelm anyone williing to help with code, so please let me know if there is more you need to see. This is what applies to the tabifier:

In the head of my php document:

[CODE]<script type="text/javascript" src="http://www.myohmomma.com/wp-includes/js/tabber-minimized.js"></script>[CODE]

In the sidebar of my php document:

[CODE] <div class="sidebar">
<div class="tabber">
<div class="tabbertab">
<h2>Welcome</h2>
<img src="images/Welcome.png" alt="" />
<div id="Connect">
<div id="Connect-01">
<img src="images/Connect_01.png" width="315" height="48" alt="" />
</div>
<div id="Connect-02">
<img src="images/Connect_02.png" width="27" height="87" alt="" />
</div>
<div id="Facebook">
<img src="images/Facebook.png" width="76" height="82" alt="" />
</div>
<div id="Connect-04">
<img src="images/Connect_04.png" width="21" height="87" alt="" />
</div>
<div id="Newsletter">
<img src="images/Newsletter.png" width="77" height="82" alt="" />
</div>
<div id="Connect-06">
<img src="images/Connect_06.png" width="21" height="87" alt="" />
</div>
<div id="Twiiter">
<img src="images/Twiiter.png" width="75" height="82" alt="" />
</div>
<div id="Connect-08">
<img src="images/Connect_08.png" width="18" height="87" alt="" />
</div>
<div id="Connect-09">
<img src="images/Connect_09.png" width="76" height="5" alt="" />
</div>
<div id="Connect-10">
<img src="images/Connect_10.png" width="77" height="5" alt="" />
</div>
<div id="Connect-11">
<img src="images/Connect_11.png" width="75" height="5" alt="" />
</div>
</div>

</div>


<div class="tabbertab">
<h2>Features</h2>
<p>Tab 2 content.</p>
</div>


<div class="tabbertab">
<h2>Categories</h2>
<p>Tab 3 content.</p>
</div>

<div class="tabbertab">
<h2>Search</h2>
<p>Tab 4 content.</p>
</div>


</div>
</div>[CODE]

From my CSS stylesheet:

[CODE].sidebar{
position: relative;
top:0px;
padding-top:20px;
padding-right:10px;
padding-left:10px;
padding-bottom:0px;
float:right;
width:350px;
}

.sidebar ul{
list-style-type: none;
margin: 0;
padding: 0 10px 0 10px;
background:#ffffff;
}

.sidebar ul li{
padding: 10px 0 10px 0;
background:#ffffff;
}

.sidebar ul li h2{
font-family: Verdana, Geneva, sans-serif;
font-size: 16px;
color: #2d0a0b;
border-top: 1px solid #2d0a0b;
border-bottom: 1px solid #2d0a0b;
padding: 5px 0px 5px 0px;
background:#ffffff;
}

.sidebar ul ul li{
padding: 0;
background:#ffffff;
}


/* $Id: example.css,v 1.5 2006/03/27 02:44:36 pat Exp $ */

/*--------------------------------------------------
REQUIRED to hide the non-active tab content.
But do not hide them in the print stylesheet!
--------------------------------------------------*/
.tabberlive .tabbertabhide {
display:none;
}

/*--------------------------------------------------
.tabber = before the tabber interface is set up
.tabberlive = after the tabber interface is set up
--------------------------------------------------*/
.tabber {
}
.tabberlive {
margin-top:1em;
}

/*--------------------------------------------------
ul.tabbernav = the tab navigation list
li.tabberactive = the active tab
--------------------------------------------------*/
ul.tabbernav
{
margin:0;
padding: 3px 0;
border-bottom: 0px solid #778;
font: bold 12px Verdana, sans-serif;
}

ul.tabbernav li
{
list-style: none;
margin: 0;
display: inline;
}

ul.tabbernav li a
{
padding: 3px 0.5em;
margin-left: 0px;
margin-right: 3px;
border: 1px solid white;
background: white;
text-decoration: none;
}

ul.tabbernav li a:link { color: #2d0a0b; }
ul.tabbernav li a:visited { color: #2d0a0b; }

ul.tabbernav li a:hover
{
color: #2d0a0b;
text-decoration:underline;
background: white;
border-color: white;
}

ul.tabbernav li.tabberactive a
{
color: #fbb1c0;
background-color: #2d0a0b;
border: 1px solid #2d0a0b;
}

ul.tabbernav li.tabberactive a:hover
{
color: #fbb1c0;
text-decoration:underline;
background: #2d0a0b;
border-bottom: 1px solid white;
}

/*--------------------------------------------------
.tabbertab = the tab content
Add style only after the tabber interface is set up (.tabberlive)
--------------------------------------------------*/
.tabberlive .tabbertab {
padding:5px;
border:10px solid #2d0a0b;

/* If you don't want the tab size changing whenever a tab is changed
you can set a fixed height */

height:285px;

/* If you set a fix height set overflow to auto and you will get a
scrollbar when necessary */

overflow:auto;
}

/* If desired, hide the heading since a heading is provided by the tab */
.tabberlive .tabbertab h2 {
display:none;
}
.tabberlive .tabbertab h3 {
display:none;
}

/* Example of using an ID to set different styles for the tabs on the page */
.tabberlive#tab1 {
}
.tabberlive#tab2 {
}
.tabberlive#tab2 .tabbertab {
height:200px;
overflow:auto;
}

#Connect {
position:absolute;
left:30px;
top:200px;
width:315px;
height:135px;
}

#Connect-01 {
position:absolute;
left:0px;
top:0px;
width:315px;
height:48px;
}

#Connect-02 {
position:absolute;
left:0px;
top:48px;
width:27px;
height:87px;
}

#Facebook {
position:absolute;
left:27px;
top:48px;
width:76px;
height:82px;
}

#Connect-04 {
position:absolute;
left:103px;
top:48px;
width:21px;
height:87px;
}

#Newsletter {
position:absolute;
left:124px;
top:48px;
width:77px;
height:82px;
}

#Connect-06 {
position:absolute;
left:201px;
top:48px;
width:21px;
height:87px;
}

#Twiiter {
position:absolute;
left:222px;
top:48px;
width:75px;
height:82px;
}

#Connect-08 {
position:absolute;
left:297px;
top:48px;
width:18px;
height:87px;
}

#Connect-09 {
position:absolute;
left:27px;
top:130px;
width:76px;
height:5px;
}

#Connect-10 {
position:absolute;
left:124px;
top:130px;
width:77px;
height:5px;
}

#Connect-11 {
position:absolute;
left:222px;
top:130px;
width:75px;
height:5px;
}[CODE]

I've visited the forums so many times as a reader and usually find solutions here. I'm usually good at figuring it out on my own, but I'm really stumped. I am new at this and I think I'm in over my head. I'd reallly appreciate some help.

Hey all,

1) When clicking on a list in an accordion, it should change the quicktime movie playing in a main window area. It works in firefox but not in safari. The variable imgTitle holds the expected output (e.g. '../images/Intro-1.mov'). It changes the src attribute of the embed tag. This change works in Firefox where the new movie plays on click. However, when clicking the list item in safari, nothing happens.

2) There is a problem in firefox as well in that the movie overlays everything else on page, even though it should be behind the text. Positioning would be tedious given that there's many nested elements and I would have to set relative positioning to the entire page. Any reason for this behavior of embed tags?

Code:

$(".image_thumb ul li ul li").click(function(){  			
 
	var imgTitle = $(this).find('a').attr("href");  
	var imgDesc = $(this).find('.block').html();  
	var imgDescHeight = $(".main_image").find('.block').height(); 	

	if ($(this).is(".active")) {   
		return false;  
	} else {
		console.log(imgTitle);
		$(".main_image .block").animate({ opacity: 0, marginBottom: -imgDescHeight }, 250 , function() {
			$(".main_image .block").html(imgDesc).animate({ opacity: 0.85,	marginBottom: "0" }, 250 );
			$(".main_image embed").attr({ src: imgTitle}); 
		});
	}

	$(".image_thumb ul li ul li").removeClass('active');  
	$(this).addClass('active');  
	return false;

}) .hover(function(){
	$(this).addClass('hover');
	}, function() {
	$(this).removeClass('hover');
});

Thanks for response.

I could use some help getting the following code to work... As is, it works fine in google chrome, but not at all in Internet Explorer 9. If I paste my code into w3schools "tryit" window, it will work great if it has less than 6 rows, any more and I get a generic "ERROR" on the screen.

javascript code
Code:

<script type="text/javascript">
Number.prototype.formatMoney = function(c, d, t){
var n = this, c = isNaN(c = Math.abs(c)) ? 2 : c, d = d == undefined ? "," : d, t = t == undefined ? "." : t, s = n < 0 ? "-" : "", i = parseInt(n = Math.abs(+n || 0).toFixed(c)) + "", j = (j = i.length) > 3 ? j % 3 : 0;
   return s + (j ? i.substr(0, j) + t : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c ? d + Math.abs(n - i).toFixed(c).slice(2) : "");
 };
    function getRowCount()
    {
        return document.getElementById('myTable').rows.length;
    }
function changeContent()
{
var lastRow = getRowCount();
var colSum=0;
for(var e=1;e<=lastRow;e++){
        var x=document.getElementById('myTable').rows[e].cells;
        p1=document.getElementById('p'+e).value;
        q1=document.getElementById('q'+e).value;
        outint = p1*q1;
        var out='<input type="text" value="'+Number(outint).formatMoney(2, '.', ',')+'" disabled="disabled">';
        x[3].innerHTML=out;
}
}
</script>

html code
Code:

<table width="600" border="1">
<tr>
<td>Item Name</td>
<td>Price per unit</td>
<td>Number of Units</td>
<td>Total Price</td>
</tr>

<tr>
<td>Item 1</td>
<td><input type="text" id="p1" value="8.3930" disabled="disabled"></td>
<td><input type="text" id="q1" value="0" onchange="changeContent()"></td>
<td><input type="text" id="t1" value="0" disabled="disabled"></td>
</tr>
<tr>
<td>Item 2</td>
<td><input type="text" id="p2" value="8.3380" disabled="disabled"></td>
<td><input type="text" id="q2" value="0" onchange="changeContent()"></td>
<td><input type="text" id="t2" value="0" disabled="disabled"></td>
</tr>
<tr>
<td>Item 3</td>
<td><input type="text" id="p3" value="62.3260" disabled="disabled"></td>
<td><input type="text" id="q3" value="0" onchange="changeContent()"></td>
<td><input type="text" id="t3" value="0" disabled="disabled"></td></tr>
<tr>
<td>Item 4</td>
<td><input type="text" id="p4" value="124.6630" disabled="disabled"></td>
<td><input type="text" id="q4" value="0" onchange="changeContent()"></td>
<td><input type="text" id="t4" value="0" disabled="disabled"></td></tr>
<tr>
<td>Item 5</td>
<td><input type="text" id="p5" value="1554.4320" disabled="disabled"></td>
<td><input type="text" id="q5" value="0" onchange="changeContent()"></td>
<td><input type="text" id="t5" value="0" disabled="disabled"></td>
</tr>
<tr>
<td>Item 6</td>
<td><input type="text" id="p6" value="2622.6750" disabled="disabled"></td>
<td><input type="text" id="q6" value="0" onchange="changeContent()"></td>
<td><input type="text" id="t6" value="0" disabled="disabled"></td></tr>
<tr>
<td>Item 7</td>
<td><input type="text" id="p7" value="4748.8650" disabled="disabled"></td>
<td><input type="text" id="q7" value="0" onchange="changeContent()"></td>
<td><input type="text" id="t7" value="0" disabled="disabled"></td>
</tr>
<tr>
<td>Item 8</td>
<td><input type="text" id="p8" value="23087.9330" disabled="disabled"></td>
<td><input type="text" id="q8" value="0" onchange="changeContent()"></td>
<td><input type="text" id="t8" value="0" disabled="disabled"></td>
</tr>
</table>

*note* the html table is actually made from a php loop pulling items from a database, but for the sake of simpler troubleshooting I made it a static table for posting here.

Please help if you can.

Thanks

hereis the html file and javascripton click of this button a
html *****************************
<table class=matcolor id=topnav cellspacing=0
cellpadding=0 width=550 border=0 bgcolor="#FFCCCC">
<tbody>
<tr align=middle>
<td id=menu1
onMouseOver="this.className='mPrimaryOn';showmenu(this);"
onClick="this.document.location.href=''"
onMouseOut="this.className='mPrimaryOff';hidemenu(this);" class="mat" height="20">
<div align="center"><font color="#FF0000">Desk Top Publishing </font></div>
</td>
<td width=1 bgcolor=#ff9900 class="mat"></td>
<td id=menu2
onMouseOver="this.className='mPrimaryOn';showmenu(this);"
onClick="this.document.location.href=''"
onMouseOut="this.className='mPrimaryOff';hidemenu(this);" class="mat" height="20">
<div align="center"><font color="#FF0000">Transcription</font></div>
</td>
<td width=1 bgcolor=#ff9900 class="mat"></td>
<td id=menu3
onMouseOver="this.className='mPrimaryOn';showmenu(this);"
onClick="this.document.location.href=''"
onMouseOut="this.className='mPrimaryOff';hidemenu(this);" class="mat" height="20">
<div align="center"><font color="#FF0000">Accounts Processing </font></div>
</td>
</tr>
</tbody>
</table>
*****************************************

<script language=JavaScript>
ix = document.getElementById('tblmenu1').getBoundingClientRect();
new ypSlideOutMenu("menu1", "right",ix.left + ix.right ,ix.bottom + 10);
</script>
**any thing i have to alter to work in firefox
please help

I am pretty new to Javascript having a bit of a problem with a website with Google Maps integrated. URL is http://beta.5vanmap.com. JS is in /js/map.js.

I have two checkboxes (ccCheck and caccCheck). The basis is when the box is ticked, it overlays a KML onto the map.

This is working fine in Chrome, but in FF and IE it doesn't work, IE returns 'ccCheck is Undefined'. The code I am using is in the JS file, the bit it gets stuck at is as follows:

Code:

document.getElementById('ccCheck').onclick = function() {
	
				  if (ccCheck == 1)
  {
	ccCheck = 0;
   ccOverlay.setMap(null);  
  }

  else

  {
   ccCheck = 1;
	ccOverlay.setMap(map);    
  }


}

If I stick a ccCheck = document.getElementById('ccCheck') within the onclick function (before the if statement), it places the overlay onto the map, but then when I untick the box it just stays there.

It's such a simple thing (I think), and must be down to IE being pedantic about declaring the variable properly, the question is how should I be doing this?

Thanks and regards
Noel

[CODE]<script type="text/javascript" language="Javascript">
<!-- Hide script from older browsers

function toggleMenu(currMenu) {
if (document.getElementById) {
thisMenu = document.getElementById(currMenu).style
if (thisMenu.display == "block") {
thisMenu.display = "none"
}
else {
thisMenu.display = "block"
}
return false
}
else {
return true
}
}

// End hiding script -->
</script> [CODE]

[CODE]<a href="javascript:void(0);" onclick="return toggleMenu('menu3')">Title</a>[CODE]

It freezes in Internet Explorer; but works fine in Chrome.

Hey guys, so I'm trying to make a single function that will check to make sure the e-mails in both fields match AND to make sure the e-mail is in proper format. Strangely, with both if statements included the form will return no messages at all. If I comment out the if statement checking for proper format, the if statement to check for matching e-mail works just fine.

I want this all to be in one function because I'm wanting it to be executed onSubmit with the form. Let me know what you guys think, any help is greatly appreciated:

Code:

<html>

<head>
<script type="text/javascript">
	function verifyEmail()
	{
			var x = document.forms["emailForm"]["enterEmail"].value;
			var y = document.forms["emailForm"]["confirmation"].value;
			var atpos = x.indexOf("@");
			var dotpos = x.lastIndexOf(".");
			
				if (x != y) {
					  var msg = "The email addresses entered do not match, please enter matching email addresses";
					  document.getElementById("error").innerHTML = msg;
					  return false;
				}
			
				if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 > = x.length) {
					  var msg = "Improper e-mail format";
					  document.getElementById("error").innerHTML = msg;
					  return false;
				}
				
				else {
					return;
				}
	}
</script>
</head>

<body>

	<form name="emailForm" onsubmit="return verifyEmail();" method="post">
		E-Mail Address: <input type="text" name="enterEmail">
		Confirm E-Mail Address: <input type="text" name="confirmation">
		<input type="submit" value="Submit"> <span id="error"></span>
	</form>
	
</body>

</html>

Hi everybody I have a problem

I want a header that is a slideshow and use lightbox for other images.
No I have this all working but not at the same time.

If I use this code in this order only the first script that is the lightbox script works.
PHP Code:
<script type="text/javascript" src="js/jquery.min.js"></script>
        <script type="text/javascript" src="js/pirobox.js"></script>
        <script type="text/javascript">
        $(document).ready(function(){
        $().piroBox({
              my_speed: 300, //animation speed
              bg_alpha: 0.5, //background opacity
              slideShow : 'true', // true == slideshow on, false == slideshow off
              slideSpeed : 3, //slideshow
              close_all : '.piro_close' // add class .piro_overlay(with comma)if you want overlay click close piroBox
              });
        });
        
        </script>
        <script src="http://code.jquery.com/jquery-latest.js"></script>
        <script src="js/jquery.cycle.all.min.js"></script>
        <script type="text/javascript">
        $(document).ready(function(){
           $('.slideshow').cycle({
              fx: 'scrollLeft',
              speed: 1000,
              timeout: 7000
           });
        });
        </script> 


If I use this code so I switched the order only the slideshow works:
PHP Code:
<script src="http://code.jquery.com/jquery-latest.js"></script>
        <script src="js/jquery.cycle.all.min.js"></script>
        <script type="text/javascript">
        $(document).ready(function(){
           $('.slideshow').cycle({
              fx: 'scrollLeft',
              speed: 1000,
              timeout: 7000
           });
        });
        </script>
<script type="text/javascript" src="js/jquery.min.js"></script>
        <script type="text/javascript" src="js/pirobox.js"></script>
        <script type="text/javascript">
        $(document).ready(function(){
        $().piroBox({
              my_speed: 300, //animation speed
              bg_alpha: 0.5, //background opacity
              slideShow : 'true', // true == slideshow on, false == slideshow off
              slideSpeed : 3, //slideshow
              close_all : '.piro_close' // add class .piro_overlay(with comma)if you want overlay click close piroBox
              });
        });
        
        </script> 


I also tried this: but then they both did not work

PHP Code:
        <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
        <script type="text/javascript" src="js/jquery.cycle.all.min.js"></script>
        <script type="text/javascript" src="js/jquery.min.js"></script>
        <script type="text/javascript" src="js/pirobox.js"></script>
        <script type="text/javascript">
        $(document).ready(function(){
                                   
           $('.slideshow').cycle({
              fx: 'scrollLeft',
              speed: 1000,
              timeout: 7000
           });
           
           $().piroBox({
              my_speed: 300, //animation speed
              bg_alpha: 0.5, //background opacity
              slideShow : 'true', // true == slideshow on, false == slideshow off
              slideSpeed : 3, //slideshow
              close_all : '.piro_close' // add class .piro_overlay(with comma)if you want overlay click close piroBox
              });
           
            });
        </script> 


Can you help me solve this problem so they both work?

Does any one have any ideas for javascript homepage apps

Hello javascript experts...

I am following this blog on calling web service in javascript.

I am getting syntax error, in my javascript...

Code:

<action trigger="onLoad">
<!--        
mainWindow.visible = true; 
 <script 
  type="text/javascript" 
  src="prototype.js"></script>
<script 
  type="text/javascript" 
  src="ws.js"></script>
<script type="text/javascript">
function getSalesXml(name, container) {
  var call = new WS.Call('<url to the wsdl>'); 
  var nsuri = 'http://example';
  var qn_op = new WS.QName('<functionName>',nsuri);
  var qn_op_resp = new WS.QName('sayHelloResponse',nsuri);  
  call.invoke_rpc(
    qn_op,
    new Array(
      {name:'userId',value:<user>}
      {name:'pwd',value:<password>}
    ),null,
    function(call,envelope) {
      var ret = 
        envelope.get_body().get_all_children()[0].
          get_all_children()[0].get_value();
      container.innerHTML = ret;
      $('soap').innerHTML = arguments[2].escapeHTML();
    }
  );
}
</script>                      
-->	
</action>

at line:

Code:

src="ws.js"></script>

Can anybody correct this error...,

Hi. I'm new to javascripting and i'm trying to familiarise myself with it for my uni course. The code i'm trying to run is below, but for some reason it doesn't work. It is supposed to bring up a prompt box asking for the date of birth, but it doesn't. Can anyone figure out why? Any help would be much appreciated.

Code:

<html>
<head>
<title>Numerological Reading</title>
<script type="text/javascript">

// Numerological Horoscope
var golden = 0;
var birthdate = null;
var planet = null;

// prompt for input and check to see that the input is 8-digit number
while (birthdate.length != 8 || isNaN(parseInt(birthdate)))
{
birthdate = prompt("Please enter your date of birth as an 8-digit number DDMMYYYY","");
}

// calculate the golden number in range 1..9
golden = eval(birthdate) % 9;
if (golden==0) golden=9;

// now work out ruling planet
switch (golden)
{
case 1 : planet = "The Sun"; break;
case 2 : planet = "The Moon"; break;
case 3 : planet = "Jupiter"; break;
case 4 : planet = "Sun/Uranus"; break;
case 5 : planet = "Mercury"; break;
case 6 : planet = "Venus!; break;
case 7 : planet = "Moon/Neptune"; break;
case 8 : planet = "Saturn"; break;
case 9 : planet = "Mars"; break;

// TO BE DONE: put in the other cases...
default: planet = "Unknown"; break;
}

// finally, write the page
document.write("Your golden number is ");
document.write(golden);
document.write("<br>Your ruling planet is "+planet);

</script>
</head>
<body>


</body>
</html>

Samii x

Hi All I have a content slider, but it only seems to work in FF and not any of the other browsers. I am using Wordpress but its not a plugin

This is what I have:
page.php
Code:

<?php if (is_front_page()) { 
	include ("homepage-slider.php");
} ?>

homepage-slider.php
Code:

<!--  Inner content DIVs should always carry "contentdiv" CSS class  -->
<!--  Pagination DIV should always carry "paginate-SLIDERID" CSS class  -->
<div id="slider1" class="sliderwrapper">
 <div class="contentdiv">
  <div class="home-div1">
   <div class="home-div-logo"></div>
  </div>
 </div>
 <div class="contentdiv">
  <div class="home-div2">
   <span></span>
  </div>
 </div>
 <div class="contentdiv">
  <div class="home-div3">
   <span></span>
  </div>
 </div>
</div>
<div id="paginate-slider1" class="pagination" style="display:none;">
</div>

<script type="text/javascript">
featuredcontentslider.init({
	id: "slider1",  //id of main slider DIV
	contentsource: ["inline", ""],  //Valid values: ["inline", ""] or ["ajax", "path_to_file"]
	toc: "#increment",  //Valid values: "#increment", "markup", ["label1", "label2", etc]
	nextprev: ["Previous", "Next"],  //labels for "prev" and "next" links. Set to "" to hide.
	revealtype: "click", //Behavior of pagination links to reveal the slides: "click" or "mouseover"
	enablefade: [true, 0.2],  //[true/false, fadedegree]
	autorotate: [true, 4000],  //[true/false, pausetime]
	onChange: function(previndex, curindex){  //event handler fired whenever script changes slide
		//previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc)
		//curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc)
	}
})
</script>

There are 2 other external files :
contentslider.js
contentslider.css

Click Here to see site.

If someone could help I would really appreciate it, been bugging me big time.
Cheers,
Jay