JavaScript - Problem With My Simple Rock Paper Scissors Game

Hi,
i made a game,where you controll a paddle to bounce back a ball and it hits the bricks on top.
The problem is that my eventhandlers don't work after i've added delay function,to make a counter(counting from 3 to 1 before game starts).
Any tips?Is it scope problem?

Code:

var ballx = 100;
var bally = 100;    //coord x and y,radius of a ball
var ballr = 10;
var recx;
var recy;           //coord x and y,width and height of a paddle
var recw = 100;
var rech = 15;
var dx = 2;        //x coord step for animated movement of ball
var dy = 2;        //y coord step for animated movement of ball
var rx = 5;        //x coord step for animated movement of paddle
var WIDTH;        //width of main canvas
var HEIGHT;       //height of main canvas
var ctx;               //drawn shape
var leftDown = false;   
var rightDown = false;        //keyboard arrow buttons
var upDown = false;
var downDown = false;
var mouseXmin;
var mouseXmax;
var intervalId;
var bricks;
var NROWS;
var NCOLS;
var BRICKWIDTH;
var BRICKHEIGHT;
var PADDING;
var y=4;

window.addEventListener("load",init,false);               //event for loading main func
window.addEventListener("keydown",buttonpressed,false);   //event for checking if button is pressed
window.addEventListener("keyup",buttonreleased,false);    //event to check if button is released
window.addEventListener("mousemove",mousemoved,false);    //event for controlling paddle with mouse movement

function init_mouse(){    //initialize coord for mouse movement

mouseXmin = document.getElementById('can').offsetLeft;
mouseXmax = mouseXmin + (WIDTH-recw);             //doesn't work that pretty...check?

}

function init_bricks(){ //initialize bricks

   NROWS = 5;
   NCOLS = 3;
   BRICKWIDTH = (WIDTH/NCOLS) - 1;
   BRICKHEIGHT = 15;
   PADDING = 1;
   
   bricks = new Array(NROWS);
   for(i=0; i<NROWS; i++){
      bricks[i] = new Array(NCOLS);
	  for(j=0; j<NCOLS; j++){
	     bricks[i][j] = 1;
      }
   } 
}

function mousemoved(e){    //function that enables movement of paddle with mouse

if(e.pageX > mouseXmin && e.pageX < mouseXmax) recx = e.pageX ;//- mouseXmin; <---why would you need that?Movement is bugyy! FIX:)

}

function buttonpressed(e){                 //to check if any of keyboard arrow buttons are pressed
                                           
if(e.which==37) { leftDown = true; }
if(e.which==39) { rightDown = true; }
if(e.which==40) { upDown = true; }
if(e.which==38) { downDown = true; }

}

function buttonreleased(e){             //function to check if button up,down,left or right is released
                                         
if(e.which==37) { leftDown = false; }
if(e.which==39) { rightDown = false; }
if(e.which==40) { upDown = false; }
if(e.which==38) { downDown = false; }

}

function clear(){                     //function to clear the stage

ctx.clearRect(0,0,800,600);

}

function circle(x,y,r){               //function to draw circle shape

ctx.beginPath();
ctx.arc(x,y,r,0,Math.PI*2,true);
ctx.closePath();
ctx.fill();

}

function rect(x,y,w,h){     //function to draw rectangle shape

ctx.beginPath();
ctx.rect(x,y,w,h);
ctx.closePath();
ctx.fill();

}

function checkforCoallision(){  //checks for borders of main canvas and if ball hits the paddle

if(ballx + dx > WIDTH-ballr || ballx + dx < ballr) dx = -dx;           
if(bally + dy < ballr ) dy = -dy;
else if (bally + dy > HEIGHT - ballr){
        if(ballx +  ballr > recx && ballx + ballr < recx + recw)
		   dy = -dy;
		else {clearInterval(intervalId); alert('Game Over,Baby!');} bounce();}

}

function draw(){           //function that draws the desired shapes and animates them

clear();                  //clears the main canvas,so the animation would look smooth

checkforCoallision();    //checks for borders of main canvas and if ball hits the paddle
		
if(leftDown) recx -= rx;                                //enables movement of paddle right and left
if(rightDown) recx += rx;

for(i=0; i<NROWS; i++){              //drawing bricks
   for(j=0; j<NCOLS; j++){
      if(bricks[i][j] == 1) {         //checking if brick exists
         rect(j * (BRICKWIDTH+PADDING)+PADDING,i * (BRICKHEIGHT+PADDING) + PADDING, BRICKWIDTH, BRICKHEIGHT)
	  }  
   }
}

//have we hit a brick?
  rowheight = BRICKHEIGHT + PADDING;
  colwidth = BRICKWIDTH + PADDING;
  row = Math.floor(bally/rowheight);
  col = Math.floor(ballx/colwidth);
  //if so, reverse the ball and mark the brick as broken
  if (bally < NROWS * rowheight && row >= 0 && col >= 0 && bricks[row][col] == 1) {
    dy = -dy;
    bricks[row][col] = 0;
  }

circle(ballx,bally,ballr);
rect(recx,recy,recw,rech);

ballx += dx;
bally += dy;

}



/* function init(){
ctx = document.getElementById('can').getContext('2d');
WIDTH = document.getElementById('can').offsetWidth ;       //gets the width of main canvas
HEIGHT = document.getElementById('can').offsetHeight ;     //gets the height of main canvastto
recx = WIDTH / 2;                                            //setting the coord x of a paddle
recy = HEIGHT - rech;                                      //setting the coord y of a paddle
init_mouse();
init_bricks();
intervalId = setInterval(draw,10);                          //calls draw func on desired interval,which is represented by number next to it
return intervalId;

}  */

function delay() {

if(y<=0) { 
document.getElementById('content2').innerHTML = "<canvas id='can' width='300' height='300'>This text is displayed if your browser does not support HTML5 Canvas.</canvas>";
ctx = document.getElementById('can').getContext('2d');
WIDTH = document.getElementById('can').offsetWidth ;       //gets the width of main canvas
HEIGHT = document.getElementById('can').offsetHeight ;     //gets the height of main canvastto
recx = WIDTH / 2;                                            //setting the coord x of a paddle
recy = HEIGHT - rech;                                      //setting the coord y of a paddle
init_mouse();
init_bricks();
intervalId = setInterval(draw,10);                          //calls draw func on desired interval,which is represented by number next to it
return intervalId;
 }
else { 
        Object = document.getElementById('content2');
		y = y - 1;
		Object.innerHTML = "<div style='text-align:center;width:25em;margin: 0px auto;height:100px;position:absolute;top:50%;margin-top:-50px;'>"+y+"</div>";
			setTimeout("delay()", 1000);}
}

Hi, i'm having problems with my console game, when i type in help when testing it just doesn't do anything, it's probarly a stupid mistake but i can't find what i did wrong :s

index.html code
Code:

<html>
<head>
<script type="text/javascript" src="scripts/jquery.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Console Game Project</title>
</head>
<body>

<div id="console">

<p id="message_startgame">Welcome to Nieli's game! To control the game you must type in commands</p>

<p id="area_northcorridor">You are in the north door. There is a sword on the ground.</p>

<p id="message_help" style="display: none;">Here is a list of commands</p>

<!--
PLACEHOLDER: THIS IS WHERE EVERYTHING WILL BE INSERTED BEFORE
-->

<div id="placeholder"></div>

<form onsubmit="return false;">
<input type="text" size="50" autofocus="autofocus" id="command_line" />
</form>

</div>

<script type="text/javascript" src="scripts/game.js"></script>

</body>
</html>

game.js code
Code:

//been to variables
beentonorthdoor = true;
//
//Item variable
sword = false;
//
//Current room
currentroom = "n_corridor";
//

$(document).ready(function() {
	$("form").submit(function() {
		var input = $("#command_line").val();
		
		if (input == "help") {
			$("#message_help").clone().insertBefore("#placeholder").fadeIn(1000);
		}
		
		$("#command_line").val("");
	}};	
}};

I have on my website ( www.nieeli.com/game/ ) the index.html, then a folder scripts with jquery.js and game.js in..

Could anyone help me

Oh, just noticed there is a Jquery help section... Sorry

Ok so i want to work on an EASY basic game. As simple as Guess what number... But there are some twist...

Ok So here is my example...

(HTML, i know this.)I'm Guessing a number 1-99. What is it?

(java) Lets say its 66 and they guess 53, have the text rusult be in a pop up window be: Too low!

(java) Lets say they guess 78, have the text rusult be in a pop up window be: Too high!

(java) Lets say they guess 100+, have the text rusult be in a pop up window be: Out of range!

(java)But lets say they guess 66, have a text result be in a pop up window be: You've won!

(java) I want a text field where you can enter your answer, and it will do the actions above.

Can anyone code this?
Thanks for reading!

This is a simple basic game i want to make.

Its a "What Am I" Riddle...

The questions is (In HTML which i already know):
I'm as light as a feather but no man can hold me for long. What am I?

the answer is: Your Breath.


(This is where the JAVASCRIPT comes in)
Lets say they guess a rock, have a pop up say:
Wrong Answer. Please try again.

Lets say they guess Your breath -OR- Breath, have a pop up say:
Correct!

I want a text field where you can enter your answer, and if they choose ANYTHING but the 2 correct answers above, it will display please try again.

Can anyone code this please?
Thanks for reading.

Hey guys, I'm new to jquery and I'm sure this is a VERY simple problem.. Here's my code

Quote:
<style type="text/css">

#box {
background: red;
width: 300px;
height: 300px;
display: none;
}

</style>

<script type="text/javascript">

$(function() {
$('a').click(function() {
$('#box').slideDown(4000);
});
});

</script>
</head>

<body>

<div id="box"></div>
<a href="#">Click Me!</a>

</body>
</html>
As you can see it's pretty simple, I've made the box slideIn. My problem is I want to make a separate button to slide it back out, but because I've used the "a" tag it's associating all links with the same function, how do I get around this? I'm sure it's really simple! Thanks

Hello,

Just trying to combine php variable with some javascript in
a simple if ... else.

This is the script code in php:

Code:

<script type="text/javascript">
var the_rad_val=<?php echo $N_rad_val;?>;

if (the_rad_val.value='n')
  {
  function removeLink(); 
  }
else
  {
  function restoreLink(); 
  }
</script>

This is how it looks in the browser (source)

Code:

<script type="text/javascript">
var the_rad_val=n;

if (the_rad_val.value='n')
  {
  function removeLink(); 
  }
else
  {
  function restoreLink(); 
  }
</script>

The 2 functions a

Code:

function removeLink() {
document.getElementById("mydiv").style.visibility = "hidden";
}

function restoreLink() {
  document.getElementById("mydiv").style.visibility = "visible";
} // end function

Guess I did something wrong because
the "mydiv" is visible when it shouldn't be

Can someone help me out as I am not too good with
javascript .

Thank you.



.

Hi all,

I'm pretty new to javascript coding and was trying to make a fading image slideshow. i have found one on dynamicdrive modified it, all looks fine. The first image shows and thats it. doesnt go through the photos :/ probably something simple but i cant work it out, any thoughts?

EDIT:
Code:

<head>
<script language="javascript1.1">
var mygallery=new fadeSlideShow({
	wrapperid: "column2", 
	dimensions: [250, 180], 
	imagearray: [
		["images/img1.png"],
		["images/img2.png"],
		["images/img3.jpg"]
	],
	displaymode: {type:'auto', pause:2500, cycles: 10, wraparound:false},
	persist: false, 
	fadeduration: 500, 
	descreveal: "ondemand",
	togglerid: ""
})
</script>
</head>
<body>
<div id="column2"><a href="#" class="next"><img src="images/img1.png" name="slide" id="rounded-image" height="288" border="0" style="filter:blendTrans(duration=3)" alt="image-1"/></a></div>
</body>

Thanks,
Storm08

I have a script that includes a JS delete function, but when I select a record and hit delete it says no record is selected. I'm sure this is a simple fix for someone in the know. Thanks in advance.

Site:

PHP Code:
<?php
    require_once('auth.php');
?>
<script type="text/javascript" src="script.js"> </script>
<?php include("header.php"); ?>
<b><div align="right"><a href="admin-index.php">Admin</a> - <a href="adminorders.php">Orders</a> - <a href="adminmain_forum.php">Support</a> - <a href="register-form.php">Add User</a> - <a href="adminlogout.php">Logout</a></div></b><br>
<b>Report Upload</b>
<br>To upload reports after completion use the form below and update the order with the report URL (/reports/filename).
<center><form action="./uploadadmin.php" method="post" enctype="multipart/form-data">
   <p>
      <label for="file">Select a file:</label> <input type="file" name="userfile" id="file"> <br />
      <p><button>Upload File</button>
   <p>
</form></center>

<p><b>Previous Orders</b>
<br>Details of previous orders and trials are displayed below.

<br><script>
<!-- Hide from old browsers

/******************************************
* Find In Page Script -- Submitted/revised by Alan Koontz (alankoontz@REMOVETHISyahoo.com)
* Visit Dynamic Drive (http://www.dynamicdrive.com/) for full source code
* This notice must stay intact for use
******************************************/

//  revised by Alan Koontz -- May 2003

var TRange = null;
var dupeRange = null;
var TestRange = null;
var win = null;


//  SELECTED BROWSER SNIFFER COMPONENTS DOCUMENTED AT
//  http://www.mozilla.org/docs/web-developer/sniffer/browser_type.html

var nom = navigator.appName.toLowerCase();
var agt = navigator.userAgent.toLowerCase();
var is_major   = parseInt(navigator.appVersion);
var is_minor   = parseFloat(navigator.appVersion);
var is_ie      = (agt.indexOf("msie") != -1);
var is_ie4up   = (is_ie && (is_major >= 4));
var is_not_moz = (agt.indexOf('netscape')!=-1)
var is_nav     = (nom.indexOf('netscape')!=-1);
var is_nav4    = (is_nav && (is_major == 4));
var is_mac     = (agt.indexOf("mac")!=-1);
var is_gecko   = (agt.indexOf('gecko') != -1);
var is_opera   = (agt.indexOf("opera") != -1);


//  GECKO REVISION

var is_rev=0
if (is_gecko) {
temp = agt.split("rv:")
is_rev = parseFloat(temp[1])
}


//  USE THE FOLLOWING VARIABLE TO CONFIGURE FRAMES TO SEARCH
//  (SELF OR CHILD FRAME)

//  If you want to search another frame, change from "self" to
//  the name of the target frame:
//  e.g., var frametosearch = 'main'

//var frametosearch = 'main';
var frametosearch = self;


function search(whichform, whichframe) {

//  TEST FOR IE5 FOR MAC (NO DOCUMENTATION)

if (is_ie4up && is_mac) return;

//  TEST FOR NAV 6 (NO DOCUMENTATION)

if (is_gecko && (is_rev <1)) return;

//  TEST FOR Opera (NO DOCUMENTATION)

if (is_opera) return;

//  INITIALIZATIONS FOR FIND-IN-PAGE SEARCHES

if(whichform.findthis.value!=null && whichform.findthis.value!='') {

       str = whichform.findthis.value;
       win = whichframe;
       var frameval=false;
       if(win!=self)
{

       frameval=true;  // this will enable Nav7 to search child frame
       win = parent.frames[whichframe];

}

    
}

else return;  //  i.e., no search string was entered

var strFound;

//  NAVIGATOR 4 SPECIFIC CODE

if(is_nav4 && (is_minor < 5)) {
   
  strFound=win.find(str); // case insensitive, forward search by default

//  There are 3 arguments available:
//  searchString: type string and it's the item to be searched
//  caseSensitive: boolean -- is search case sensitive?
//  backwards: boolean --should we also search backwards?
//  strFound=win.find(str, false, false) is the explicit
//  version of the above
//  The Mac version of Nav4 has wrapAround, but
//  cannot be specified in JS

 
        }

//  NAVIGATOR 7 and Mozilla rev 1+ SPECIFIC CODE (WILL NOT WORK WITH NAVIGATOR 6)

if (is_gecko && (is_rev >= 1)) {
   
    if(frameval!=false) win.focus(); // force search in specified child frame
    strFound=win.find(str, false, false, true, false, frameval, false);

//  The following statement enables reversion of focus 
//  back to the search box after each search event 
//  allowing the user to press the ENTER key instead
//  of clicking the search button to continue search.
//  Note: tends to be buggy in Mozilla as of 1.3.1
//  (see www.mozilla.org) so is excluded from users 
//  of that browser.

    if (is_not_moz)  whichform.findthis.focus();

//  There are 7 arguments available:
//  searchString: type string and it's the item to be searched
//  caseSensitive: boolean -- is search case sensitive?
//  backwards: boolean --should we also search backwards?
//  wrapAround: boolean -- should we wrap the search?
//  wholeWord: boolean: should we search only for whole words
//  searchInFrames: boolean -- should we search in frames?
//  showDialog: boolean -- should we show the Find Dialog?


}

 if (is_ie4up) {

  // EXPLORER-SPECIFIC CODE revised 5/21/03

  if (TRange!=null) {
      
   TestRange=win.document.body.createTextRange();
 
      

   if (dupeRange.inRange(TestRange)) {

   TRange.collapse(false);
   strFound=TRange.findText(str);
    if (strFound) {
        //the following line added by Mike and Susan Keenan, 7 June 2003
        win.document.body.scrollTop = win.document.body.scrollTop + TRange.offsetTop;
        TRange.select();
        }


   }
   
   else {

     TRange=win.document.body.createTextRange();
     TRange.collapse(false);
     strFound=TRange.findText(str);
     if (strFound) {
        //the following line added by Mike and Susan Keenan, 7 June 2003
        win.document.body.scrollTop = TRange.offsetTop;
        TRange.select();
        }



   }
  }
  
   if (TRange==null || strFound==0) {
   TRange=win.document.body.createTextRange();
   dupeRange = TRange.duplicate();
   strFound=TRange.findText(str);
    if (strFound) {
        //the following line added by Mike and Susan Keenan, 7 June 2003
        win.document.body.scrollTop = TRange.offsetTop;
        TRange.select();
        }

   
   }

 }

  if (!strFound) alert ("Order '"+str+"' not found!") // string not found

        
}
// -->
</script>

<!--  EXAMPLE FORM OF FIND-IN-PAGE SEARCH USING SUBMIT (ALLOWING 'ENTER/RETURN' KEY PRESS EVENT) -->
<center><b>Enter order number</b> <form name="form1" onSubmit="search(document.form1, frametosearch); return false"><input type="text" name="findthis" size="15" title="Press 'ALT s' after clicking submit to repeatedly search page"> <input type="submit" value="Search Orders" ACCESSKEY="s"></form></center>


<br><br><table width="775" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
  <tr>
    <td>
      <form action="" method="post" name="" id="">
        <table width="600" border="1" align="center" cellpadding="2" cellspacing="2">
          <tr>
            <td><input name="topcheckbox" type="checkbox" class="check" id="topcheckbox" onClick="selectall();" value="ON">
Select All &nbsp;&nbsp;&nbsp;</td>
            <td colspan="4" align="center"><a href="form.php?mode=add">Add New Order</a></td>
          </tr>
          <tr>
            <td><strong><a href="javascript:goDel()">Delete</a></strong></td>
            <td><strong>Order Number</strong></td>
            <td><strong>Order Status</strong></td>
            <td><strong>Payment Status</strong></td>
            <td><strong>Update</strong></td>
          </tr>
          <?
          include("conn.php");
          $sql="select sn,branchname,shortname,payment from $branch order by sn";
          $result=mysql_query($sql,$connection) or die(mysql_error());
          while($row=mysql_fetch_array($result)) {
          ?>
          <tr>
            <td><input name="<? echo $row['sn']; ?>" type="checkbox" class="check"></td>
            <td><? echo $row['branchname']; ?></td>
            <td><? echo $row['shortname']; ?></td>
            <td><? echo $row['payment']; ?></td>
            <td><a href="<? echo "form.php?sn=".$row['sn']."&mode=update"; ?>">Update</a></td>
          </tr>
          <? } ?>
          <tr>
            <td><strong><a href="javascript:goDel()">Delete</a></strong></td>
            <td><strong>Order Number</strong></td>
            <td><strong>Order Status</strong></td>
            <td><strong>Payment Status</strong></td>
            <td><strong>Update</strong></td>
          </tr>
        </table>
    </form></td>
  </tr>
</table>

<?php include("footer.php"); ?>

JS File

Code:

function goDel()
{
	var recslen =  document.forms[0].length;
	var checkboxes=""
	for(i=1;i<recslen;i++)
	{
		if(document.forms[0].elements[i].checked==true)
		checkboxes+= " " + document.forms[0].elements[i].name
	}
	
	if(checkboxes.length>0)
	{
		var con=confirm("Are you sure you want to delete");
		if(con)
		{
			document.forms[0].action="delete.php?recsno="+checkboxes
			document.forms[0].submit()
		}
	}
	else
	{
		alert("No record is selected.")
	}
}

function selectall()
{
//		var formname=document.getElementById(formname);

		var recslen = document.forms[0].length;
		
		if(document.forms[0].topcheckbox.checked==true)
			{
				for(i=1;i<recslen;i++) {
				document.forms[0].elements[i].checked=true;
				}
	}
	else
	{
		for(i=1;i<recslen;i++)
		document.forms[0].elements[i].checked=false;
	}
}

Hi

i am trying to combine these two statments
Code:

searchValue.replace( /\[[^\)]*\]/g,"");
searchValue.replace( /\([^\)]*\)/g, "");

is it possible to put these two into one statment?

also is there a javascript function which does the same as urlencode?

many thanks
Luke

Hello I would like to know how this is not functional. surely passing the function to another function would work so I can use the same variables without having to write it out again.


[ICODE]
<html>
<head>
<title>Number Conversions</title>
<script>
function addNumbers ()
{
var firstnumber = document.calculator.myFirstNumber.value;
var secondnumber = document.calculator.mySecondNumber.value;
var total = parseInt(firstnumber) + parseInt(secondnumber);
document.calculator.myTotal.value = total;
document.calculator.myHex.value = total.toString(16);
document.calculator.myOct.value = total.toString(8);
document.calculator.myBinary.value = total.toString(2);

document.write("End of Calculation.");
}

function subtractNumbers (addNumbers)
{
var total = parseInt(firstnumber) - parseInt(secondnumber);
}
</script>
</head>
<body>
<form name="calculator">
First Number
<input type=text name="myFirstNumber" value=0 size=3> <br>
Second Number
<input type=text name="mySecondNumber" value=0 size=3><br><br>
<input type="button" value="ADD" onclick="addNumbers();">
<input type="button" value="SUBTRACT" onclick="subtractNumbers();"><br>
Total
<input type=text name="myTotal" value=0 size=3><br>
Binary
<input type=text name="myBinary" value=0 size=8><br>
Octal
<input type=text name="myOct" value=0 size=3><br>
Hexidecimal
<input type=text name="myHex" value=0 size=3><br>
</form>
</body>
</html>
[ICODE]

Hi folks this is my first post

Edit: sorry for the incorrect title should have read simple javascript validation problem!

i have a fair understanding of php and mysql and have never had to use javascript as i was secretly trying to avoid it.

The time has now come where i want to use it for client side validation on a form. I am able to validate most of fields however i need to validate a date to check it has been entered in the following format dd/mm/yyyy and that the date is not greater than todays date. N.B the date is entered into a text field in HTML

i wrote a function with lots of if/else statements and failed. Im 100% positive there is a far simpler way to achieve my goal any help would be greatly appreciated.

Thanks
Code:

function checkDate(elem, helperMsg){

var day = elem.substr(0,2);
var month = elem.substr(3,2);
var year = elem.substr(6,4);

if(day < 01 || day > 31)
    {
        var invalidday = true;
    }
    if (month < 0 || month > 12)
        {
            var invalidmonth = true;
        }
        if (year < 01 || year > 2099)
            {
                var invalidyear = true;
            }
            if ( month==04 || month==06 || month==09|| month==11)
                {
                    if (day == 31)
		   {
                       var invalidday = true;
                   }
                }
                if (month==02)
	   {
		   if (day > 28)
		   {
                       var invalidday = true;
                   }
           }
           if (invalidday || invalidmonth || invalidyear)
               {
                   alert(helperMsg);
                   elem.focus();
                   return false;
               }
               else
                   {
                       var dd = today.getDate();
                       var mm = today.getMonth()+1;//January is 0!
                       var yyyy = today.getFullYear();
                       if(dd < 10)
                       {
                           dd='0'+dd;
                       }
                       if(mm < 10)
                       {
                           mm='0'+mm;
                       }
                   }
                   if (day > dd && month > mm && year > yyyy)
                       {
                           alert(helperMsg);
                           elem.focus();
                           return false;
                       }
                       else
                           {
                               return true;
                           }
}

Hey guys, so I am a designer (not a developer) doing a site for someone.
I am playing with some simple free javascripts.

I have lightbox and toggler. Both work great individually.
They are conflicting and everywhere online says to set the both to onLoad in the body tag.
Sounds easy enough.

But I can't seem to figure out the call for this script:
Code:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="../js/expand.js"></script>
<script type="text/javascript">

$(function() {
$("h2.expand").toggler({method: "fadeToggle"});
});
//--><!]]>
</script>

<body onload="toggler();initLightbox()"> is what is seems like it should be for me. But that isn't working at all.

Please help!

I feel like I have tried every possible name with the toggler()...


If you need more, I can point you to the site itself and you can see all of the (messy) code.

Hello was following a tutorial online from bucky. and created a new example with different variables and such. My code in my eyes looks absolutely fine but however it does not display can anyone spot the problem?

[code]

<!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" />
<title>Untitled Document</title>
<script type="text/javascript">

function cigerettes (brand, tar, price) {
this.brand=brand;
this.tar=tar;
this.price=price;
this.ReducedCost = discount;
}

function discount() {
var reduction = 20;
var finalCost = this.price - reduction;
return finalCost;
}

var packet1 = new cigerettes("Mayfair", "2.0 mg", 399);
var packet2 = new cigerettes("Sovereign", "3.4 mg", 425);
</script>
</head>

<body>
<script type="text/javascript">

document.write(packet1.brand()
+ " they contain " + packet1.tar() +
"of tar " + "the packet cost me " + packet1.price()
+ ". With discount I got them for: " + packet1.ReducedCost());

</script>
</body>
</html>

[code]

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=us-ascii">
Code:

<SCRIPT type="text/Javascript">
<!--
function submitClick() {
	var userid = document.login.userid.value;
	var pin = document.login.pin.value;
	
	if (document.login.userid.value=='')
	{
		window.alert('User ID not entered');
	}
	else if (document.login.pin.value=='')
	{
		window.alert('Pin not entered');
	}
	else
	{
		window.alert (
		"User ID: " + userid +
		"\nPIN: " + pin 
		);
	}
}
//-->	  
</SCRIPT>

</head>
<body>
<center><img height="120" width="240">
<h3 align="center">Please enter your User ID and PIN:</h3>
<center>
<table width="50%" id="Table1">
<tbody>
<tr>
<td width="50%" align="RIGHT">User ID:</td>
<td width="50%" align="LEFT"><input type="text" name="userid" size="20"></td>
</tr>
<tr>
<td align="RIGHT">PIN:</td>
<td align="LEFT"><input type="text" name="pin" size="20"></td>
</tr>
<tr>
<td></td>
Code:

<td align="LEFT"><INPUT TYPE="button" NAME="button" VALUE="Submit" onSubmit="return submitClick();"></td>

</tr>
</tbody>
</table>
</center>
</center>
</body>
</html>

I'm needing the program to use pop up windows when no user id has been entered or no pin has been entered. If both have been entered then i need it to show the user id and pin in a pop up window. Not sure where I've went wrong so any help would be much appreciated.

I've written this very small and simple javascript toggle to make a div appear and disappear upon click.

Code:

function dropDown(id){
    var object = document.getElementById(id).style;
    
    if (object.display == "none") {object.display = "block"}
    else {object.display = "none"}
    }

And the html:
Code:

<div id="webBox" class="service">
<ul class="servNav">
    <li class="button" onclick="dropDown('webDrop')">View Details</li>
</ul>
</div>
<div class="dropInfo" id="webDrop">

Now this code DOES work, but only after clicking the button twice. I assume there is some argument problem, but I can't seem to pinpoint it. I've got jquery scripts and plugins on the page, but it does the same thing when I take those off.

Is there anything I can do to make the toggle immediate rather than after a couple tries of clicking?

The URL is http://mattboldt.com/2.0

The "view details" buttons are what I'm having trouble with. As of now it's only on one, the first div.

Thanks.