JavaScript - Show All Array? .each()?

I can't seem to figure out how to accomplish this. In my website, I would like the user to input text into a single or multiple textbox(es) and then have the contents of the textbox(es) stored to either a variable or an array. Then I would like to have that variable/array compared to other arrays. Basically, the user is searching for items in a database. The user can search for as many or as little items as they want. Then the item(s) will be compared to multiple arrays to find out if what the user wants is in the database.

So for example, let's say the user is searching for recipes that have all or part of these ingredients: chicken, broccoli, lemon, honey. So, there would have been a total of 4 textboxes...one for each ingredient. These ingredients are stored to an array..lets call it ingredient(). In the database of recipes, each recipe has its own array which includes the ingredients needed to make the recipe, we'll call them tag1(), tag2(), and tag3(). Now, I want the array, ingredient(), to be compared to each of the "tag" arrays to see if any of the "tag" arrays include exactly match the ingredient() tag in part or in whole. Is this possible?

I have the following array that contain the people who are on off on certain time:

Code:

var all = [
    ["1234", "Jim", "2011-10-23 00:00:00", "2011-10-25 07:00:00"],
    ["1235", "Jack", "2011-10-21 00:00:00", "2011-10-21 08:00:00"],
    ["1236", "Jane", "2011-10-11 00:00:00", "2011-10-11 00:30:00"],
    ["1237", "June", "2011-10-20 00:00:00", "2011-10-20 12:00:00"],
    ["1238", "Jill", "2011-10-14 00:00:00", "2011-10-14 11:00:00"],
    ["1239", "John", "2011-10-16 00:00:00", "2011-10-16 10:30:00"],
    ["1240", "Jacab", "2011-10-19 00:00:00", "2011-10-20 08:30:00"]
];

The above array, I wish to use javascript to insert into the FullCalendar (http://arshaw.com/fullcalendar/). I notice that the only way seems to be using the FullCalendar array style (or structure) as follows:

Code:

$('#calendar').fullCalendar({
    events: [
        {
            title  : 'event1',
            start  : '2010-01-01'
        },
        {
            title  : 'event2',
            start  : '2010-01-05',
            end    : '2010-01-07'
        },
        {
            title  : 'event3',
            start  : '2010-01-09 12:30:00',
            allDay : false // will make the time show
        }
    ]
});

So, the question is: How do I insert my array to match with the FullCalendar array? cause FullCalendar array had a different array structure from my array - and I don't think so that I can write in this way:
Code:

$('#calendar').fullCalendar({
    events:all
});

Appreciate any help provided.

Hi,
i can't find the mistake in my little script hope someone can help me.

PHP Code:
<?php

/* -------------------- read thumbfolder -------------------- */
    
    function isRdyPfD($filename){ 

        if ($filename == '.' || $filename == '..') {
        // To-Top-Dir
        return false;
    }
    
    $ext = explode(".",$filename);
    $ext = $ext[sizeof($ext) - 1];
    $allowedformats = array (
        'jpg', 
        'png',
        'jpeg',
        'gif'
    );
    
    return in_array($ext,$allowedformats);
    } 

    function getPicsfromDir($dir){ 
    /* array with names of the pictures in  $dir */

        if (is_dir($dir)) {
        if ($dh = opendir($dir)) {
                $filearray = array();
        while (($file = readdir($dh)) !== false) {
            if (isRdyPfD($file) === true) {
                $filearray[] = $file;
            }
        }
        closedir($dh);
                return $filearray;
        }
    }
    else {
        return false;
    }
    } // End Function


    $thumbs = getPicsfromDir("./images/thumbs/");
    

/* -------------------- thumbfolder  -------------------- */    
    echo "<div id='thumbslider'>\n";
    echo "<ul id='thumbs'>\n";
    for($i = 0; $i < count($thumbs); $i++){
            echo "<li><img src=\"./images/thumbs/$thumbs[$i]\" onclick=\"thumbClick($i)\"  /></li>\n";
            
    }
    echo "</ul>\n";
    echo "</div>\n";
    




/* -------------------- big size images folder -------------------- */
    $bigSizeImages = getPicsfromDir("./images/");
    //print_r($bigSizeImages);
    
    $jsValue = '';
    for ($j=0; $j < count($bigSizeImages); $j++){
                $jsValue = $jsValue . $bigSizeImages[$j];
                if ($j < (count($bigSizeImages)-1)) {
                        $jsValue = $jsValue . ",";
                }
   }
    
?> 


<script type="text/javascript">
        images = new Array(<?php echo $jsValue ?>);
        
    

    
    
    function thumbClick(pos){
            
            //alert(pos);
            alert(images[pos]);
            
    }

</script>

I can't trace the images array values?
thanks for a feedback!!!

Hi,
In a nutshell,can anyone tell me how to copy a 2d (two dimensional ,2 dimensional) php array to 2d javascript array?I would be obliged if anyone can provide me a method of doing that

OR
I have written a code to copy a 2d php array to a 2d javascript array.It is working but there is one problem(please see the following).Can anyone tell me what I am doing wrong here?


The 2d php array is $quest[100][6] and the 2d javascript array is questions[100][6] . I have written the javascript code inside the <?php....?> itself using echo "<script language="javascript" type="text/javascript">.......</script>;




Now ,inside the javascript,when I try to copy the 2d php array to the 2d javascript array using the following method it works

questions[0]= ["<?php echo join("\", \"", $quest[0]); ?>"];
questions[1]= ["<?php echo join("\", \"", $quest[1]); ?>"]; ... and so on


However, if I try to do the same using the following method it does not work
for (var i= 0; i <= 99; i++)
{ questions[i]= ["<?php echo join("\", \"", $quest[i]); ?>"]; }

Why is that?What mistake am I making?Any help will be deeply appreciated.Thanks



-----------------------------THE CODE------------------------------------
<?php


Access database and store result of mysq_query in $result.......
$result = mysql_query($query);


for ( $count = 0; $count <= 99; $count++)
{
$quest[$count]=mysql_fetch_array($result,MYSQL_NUM);;

}

echo "<script language="javascript" type="text/javascript">

var questions = new Array(100);
for (var i = 0; i <100; i++)
{ questions[i] = new Array(6); }



/*The following method of copying 2d php array to 2d javascript array is not working
for ( var i = 0; i <= 99; i++)
{ questions[i]= ["<?php echo join("\", \"", $quest[i]); ?>"]; }
*/

/*The following method ,however,is working*/
questions[0]= ["<?php echo join("\", \"", $quest[0]); ?>"];
questions[1] = ["<?php echo join("\", \"",$quest[1]); ?>"];
questions[2] = ["<?php echo join("\", \"",$quest[2]); ?>"]; ....and so on




</script>";


mysql_close($db_server);

?>

Hi,
Here is a working code to copy 2d php array to 2d javascript array.


Code:

<html>

<head>

<?php

for($i = 0; $i < 3; $i++)
 {
   for($j = 0; $j < 2; $j++)
                   {$quest[$i][$j] = $i*10+$j;}
 }


?>



<script type="text/javascript">


var questions = new Array(3);

  for (var i = 0; i < 3; i++)
  {
   questions[i] = new Array(2);
  }

questions[0] = ["<?php echo join("\", \"", $quest[0]); ?>"];
questions[1] = ["<?php echo join("\", \"", $quest[1]); ?>"];
questions[2] = ["<?php echo join("\", \"", $quest[2]); ?>"];



document.write(questions[0][0] + "<br />");
document.write(questions[0][1] + "<br />");
document.write(questions[1][0] + "<br />");
document.write(questions[1][1] + "<br />");
document.write(questions[2][0] + "<br />");
document.write(questions[2][1] + "<br />");


</script>




</head>

</html>

Now,here's the thing.Notice these lines in the code


questions[0] = ["<?php echo join("\", \"", $quest[0]); ?>"];
questions[1] = ["<?php echo join("\", \"", $quest[1]); ?>"];
questions[2] = ["<?php echo join("\", \"", $quest[2]); ?>"];

I would like to put these lines in a loop,something like

for (var i = 0; i < 3; i++)
{
questions[i] = ["<?php echo join("\", \"", $quest[i]); ?>"];
}

But even after a lot of efforts I am unable to do so,what am I doing wrong?Thanks

I'm having major pains trying to figure this out. I'm kind of new to Javascript, I need to open a text file from an external server, store each line in an array, then search that array for a certain word (HIGH), and if it exists then write something to the webpage, and if not, write something else. Here is what I have so far:

Code:

<html>
<head>
<title>Test</title>
<script>
<!--
function test(x) {
  if (wxd1txt.readyState === 4 && wxd1txt.status === 200) {  // Makes sure the document is ready to parse and Makes sure it's found the file.
	 var wxd1text = wxd1txt.responseText; 
     var wxd1array = wxd1txt.responseText.split("\n"); // Will separate each line into an array
	 var wxd1high = wxd1array.toString();  //Converting the String content to String
	//var highsearchreg = new RegExp("HIGH");
//var wxd1high = wxd1array[x].search(highsearchreg);
document.write(wxd1high);
	if (wxd1high.search("HIGH") >= 0){
		document.write("HIGH RISK");}
		else {
		document.write("NO RISK");}
		}
}
//-->
</script>
</head>
<body>
Hi!
<script>
<!--
var Today = new Date();
var ThisDay = Today.getDate();
var ThisMonth = Today.getMonth()+1;
var ThisYear = Today.getYear();
var Hour = Today.getHours();
var Day2 = Today.getDate()+1;
var Day3 = Today.getDate()+2;
if (navigator.appName != "Microsoft Internet Explorer") {
ThisYear = ThisYear + 1900;}
if (ThisMonth < 10) {
	ThisMonth = "0" + ThisMonth;}
if (ThisDay < 10) {
	ThisDay = "0" + ThisDay;}
if (Hour == 2 || Hour == 22 || Hour == 23 || Hour == 0 || Hour == 1) {
	var wxHourd1 = 0600}
	else if (Hour >= 3 && Hour <= 10) {
		var wxHourd1 = 1300;}
			else if (Hour >= 11 && Hour <= 13) {
				var wxHourd1 = 1630;}
					else if (Hour >= 14 && Hour <= 16) {
						var wxHourd1 = 2000;}
							else if (Hour >= 17 && Hour <= 21) {
								var wxHourd1 = 0100;}		
//var wxurld1 = "http://www.spc.noaa.gov/products/outlook/archive/"+ThisYear+"/KWNSPTSDY1_"+ThisYear+""+ThisMonth+""+ThisDay+""+wxHourd1+".txt";
var wxurld1 = "http://www.spc.noaa.gov/products/outlook/archive/2010/KWNSPTSDY1_201005101300.txt" //(High risk day for testing)
//document.write(wxurld1); //Use this to verify this section is working
if (window.XMLHttpRequest)
  {
  wxd1txt=new XMLHttpRequest();
  }
else // IE 5/6
  {
  wxd1txt=new ActiveXObject("Microsoft.XMLHTTP");
  }
wxd1txt.open("GET", wxurld1, true);
wxd1txt.onreadystatechange = test();

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

When added to a webpage, nothing shows up except the "Hi!" and there are no errors in the Javascript Console in Google Chrome. Is this possible with Javascript, and if so, what am I doing wrong or not doing?

Also, I have 2 URLs, one is a text file that has the HIGH text I want for an example, the other is the current file, which shouldn't have HIGH in it (unless the weather in the US turns really bad)

Hello all, I have this code where you click on a state and it gives you haunted places for that state. Here's my HTML code:

Code:

<img src="media/us_map.gif" border="0" usemap="#map" style="border:1px solid #999999;padding:5px;background-color:white;"/>
<map name="map" id="map">
	<area onclick="me();" title="Maine"shape="poly" coords="532,77,522,52,525,51,527,47,526,38,525,29,528,18,532,20,536,15,541,18,546,34,560,45"Maine" />
	<area onclick="nh();" title="New Hampshire" shape="poly" coords="517,83,517,64,523,56,532,81,519,86"New_Hampshire" />
	<area onclick="vt();" title="Vermont" shape="poly" coords="502,58,505,78,508,84,511,92,519,88,516,66,520,55"Vermont" />
  	<area onclick="ma();" title="Massachusetts" shape="poly" coords="543,91,546,94,538,98,533,94,532,92,512,100,512,93,533,81,518,86,531,85,538,87"Massachusetts" />
  	<area onclick="ri();" title="Rhode Island" shape="poly" coords="528,95,531,104,536,98,531,94"Rhode_Island" />
  	<area onclick="ct();" title="Connecticut" shape="poly" coords="513,101,515,111,529,104,528,96,524,97"Connecticut" />
	<area onclick="ny();" title="New York" shape="poly" coords="529,110,519,118,510,119,494,104,453,114,449,109,455,104,453,97,458,94,471,92,479,85,472,78,480,75,481,67,498,61,490,62,501,61,504,78,511,92,510,100,514,110,514,114,511,112"New_York" />
 	<area onclick="nj();" title="New Jersey" shape="poly" coords="501,134,507,140,512,125,509,123,511,114,502,109,500,112,497,121,505,127,506,125,500,132"New_Jersey" />
 	<area onclick="de();" title="Delaware" shape="poly" coords="495,136,500,152,507,148,498,134"Delaware" />
  	<area onclick="md();" title="Maryland" shape="poly" coords="502,167,506,156,507,149,501,153,492,137,460,142,460,148,465,147,473,144,479,146,483,147"Maryland" />
  	<area onclick="pa();" title="Pennsylvania" shape="poly" coords="463,150,458,119,464,114,468,119,509,110,515,115,512,126,518,132,512,140"Pennsylvania" />
  	<area onclick="wv();" title="West Virginia" shape="poly" coords="436,176,429,167,432,159,447,145,458,145,447,149,459,145,461,150,470,147,464,160,457,162,452,178"West_Virginia" />
  	<area onclick="va();" title="Virginia" shape="poly" coords="427,190,437,178,450,180,458,163,465,162,471,146,485,150,495,163,502,176"Virginia" />
  	<area onclick="nc();" title="North Carolina" shape="poly" coords="418,216,431,214,439,207,450,206,455,208,468,209,484,221,487,217,497,205,501,204,511,193,505,176,446,185,441,198,432,197,420,212"North_Carolina" />
  	<area onclick="sc();" title="South Carolina" shape="poly" coords="430,215,436,220,445,230,457,238,459,250,485,221,470,210,449,205,438,208"South_Carolina" />
  	<area onclick="ga();" title="Georgia" shape="poly" coords="415,275,415,251,405,216,429,215,445,231,455,238,459,251,456,267,451,272,450,276,445,272"Georgia" />
  	<area onclick="fl();" title="Flordia" shape="poly" coords="387,275,386,283,398,282,409,284,416,290,429,282,439,289,445,292,445,311,456,326,462,335,470,341,463,351,471,349,479,339,481,325,476,310,470,298,462,284,458,270,452,275,445,272,418,277,413,271"Florida" />
  	<area onclick="al();" title="Alabama" shape="poly" coords="377,284,374,221,403,218,412,247,413,272,389,272,384,282"Alabama" />
  	<area onclick="ms();" title="Mississippi" shape="poly" coords="341,277,348,260,345,251,346,234,354,221,373,220,376,285,365,288,362,278"Mississippi" />
  	<area onclick="la();" title="Lousiana" shape="poly" coords="313,297,319,278,312,266,311,246,316,250,342,250,347,259,342,278,361,279,364,289,363,297,368,302,358,303,348,305,341,294,330,302"Louisiana" />
  	<area onclick="tn();" title="Tennasee" shape="poly" coords="356,220,361,200,372,199,445,187,442,198,432,196,419,216"Tennasee" />
 	<area onclick="ky();" title="Kentucky" shape="poly" coords="363,198,365,191,370,191,371,182,386,178,405,160,415,165,427,164,436,178,424,189"Kentucky" />
  	<area onclick="oh();" title="Ohio" shape="poly" coords="407,160,400,124,413,121,423,125,431,123,439,116,447,143,431,159,430,163,415,162,421,163"Ohio" />
  	<area onclick="mi();" title="Michigan" shape="poly" coords="381,124,387,112,381,101,381,89,395,68,400,73,405,76,410,86,405,95,406,103,414,91,419,101,420,111,412,122"Michigan" />
  	<area onclick="mi();" title="Michigan" shape="poly" coords="341,62,353,70,366,74,367,85,371,70,381,70,390,64,399,66,400,54,360,46"Michigan" />
  	<area onclick="ind();" title="Indiana" shape="poly" coords="375,180,375,129,384,125,400,124,408,160,388,177"Indiana" />
  	<area onclick="il();" title="Illinois" shape="poly" coords="364,192,356,184,348,177,350,170,344,169,334,154,338,150,339,138,347,127,344,124,340,120,368,116,373,130,375,180,368,180,369,189"Illinois" />
  	<area onclick="wi();" title="Wisconsin" shape="poly" coords="339,121,335,106,319,91,316,78,324,73,322,65,336,59,364,77,365,90,373,80,367,113,368,116"Wisconsin" />
  	<area onclick="mn();" title="Minnesota" shape="poly" coords="286,108,286,86,280,80,283,74,280,33,298,33,323,45,343,43,322,66,324,73,316,80,318,90,337,107"Minnesota" />
  	<area onclick="ia();" title="Iowa" shape="poly" coords="285,108,284,123,292,148,337,148,338,138,346,127,341,120,335,107"Iowa" />
  	<area onclick="mo();" title="Missouri" shape="poly" coords="293,150,301,157,299,163,309,171,305,198,354,200,352,207,360,206,365,194,347,177,349,171,344,169,334,154,339,148"Missouri" />
  	<area onclick="ar();" title="Arkansas" shape="poly" coords="309,243,307,199,352,203,348,208,358,207,356,220,346,234,344,247,314,248,341,248,318,251"Arkansas" />
  	<area onclick="nd();" title="North Dakota" shape="poly" coords="215,73,219,31,278,32,281,76"North_Dakota" />
  	<area onclick="sd();" title="South Dakota" shape="poly" coords="209,112,216,74,279,77,285,85,282,121,276,115,270,117,264,114"South_Dakota" />
  	<area onclick="ne();" title="Nebraska" shape="poly" coords="209,136,210,113,264,114,267,116,275,117,282,122,292,152,294,154,229,152,226,142,228,139"Nebraska" />
  	<area onclick="ks();" title="Kansas" shape="poly" coords="227,192,227,152,294,155,301,159,294,163,309,172,304,197"Kansas" />
  	<area onclick="ok();" title="Oklahoma" shape="poly" coords="213,199,214,192,306,199,309,244,291,241,271,243,256,235,246,233,247,202"Oklahoma" />
  	<area onclick="tx();" title="Texas" shape="poly" coords="168,258,170,270,184,280,188,296,201,303,212,294,224,294,242,318,253,338,274,348,273,324,312,299,317,278,310,268,311,245,290,242,276,245,255,237,245,233,246,203,213,200,209,259"Texas" />
  	<area onclick="mt();" title="Montana" shape="poly" coords="115,16,110,30,120,50,115,61,123,61,129,82,148,79,211,86,218,30"Montana" />
  	<area onclick="wy();" title="Wyoming" shape="poly" coords="137,127,145,79,213,87,209,105,209,138"Wyoming" />
  	<area onclick="co();" title="Colorado" shape="poly" coords="153,184,161,132,227,140,228,149,226,191"Colorado" />
  	<area onclick="nm();" title="New Mexico" shape="poly" coords="140,261,153,182,213,190,208,257,151,253,149,263"New_Mexico" />
  	<area onclick="idaho();" title="Idaho" shape="poly" coords="79,105,90,74,86,73,99,61,95,49,106,13,114,16,109,27,119,49,115,60,122,64,128,82,145,81,136,114"Idaho" />
  	<area onclick="ut();" title="Utah" shape="poly" coords="98,175,111,112,135,113,135,125,160,130,153,184"Utah" />
  	<area onclick="az();" title="Arizona" shape="poly" coords="80,236,117,255,135,263,152,186,99,174,92,192,89,191,89,214"Arizona" />
  	<area onclick="wa();" title="Washington" shape="poly" coords="34,34,41,37,44,47,95,51,105,12,60,1,57,14,51,20,49,11,38,6"Washington" />
  	<area onclick="or();" title="Oregon" shape="poly" coords="79,102,11,85,34,34,42,37,42,49,94,52,98,62,85,72,89,77"Oregon" />
  	<area onclick="nv();" title="Nevada" shape="poly" coords="53,98,42,134,87,199,89,190,93,191,97,174,110,112"Nevada" />
 	<area onclick="ca();" title="California" shape="poly" coords="78,234,51,233,41,209,30,198,21,197,21,185,13,166,14,158,7,150,6,108,12,88,53,97,42,135,87,200,85,216"California" />
  	<area onclick="ak();" title="Alaska" shape="poly" coords="0,370,133,345,101,312,84,315,69,256,26,252,6,252,0,252"Alaska" />
  	<area onclick="hi();" title="Hawaii" hape="poly" coords="139,322,159,355,193,364,221,362,197,331,158,320"Hawaii" />
  	<area onclick="dc();" title="Washington DC" shape="rect" coords="514,182,535,196"Washington DC" />
  	<area onclick="md();" title="Maryland" shape="rect" coords="517,160,540,174"Maryland" />
  	<area onclick="de();" title="Delaware" shape="rect" coords="531,141,550,156"Delaware" />
  	<area onclick="nj();" title="New Jersey" shape="rect" coords="519,125,538,138"New_Jersey" />
  	<area onclick="ct();" title="Connecticut" shape="rect" coords="532,113,549,125"Connecticut" />
  	<area onclick="ri();" title="Rhode Island" shape="rect" coords="558,94,571,108"Rhode_Island" />
  	<area onclick="ma();" title="Massachusetts" shape="rect" coords="549,72,568,86"Massachusetts" />
  	<area onclick="nh();" title="New Hampshire" shape="rect" coords="502,29,522,42"New_Hampshire" />
  	<area onclick="vt();" title="Vermont" shape="rect" coords="476,29,496,44"Vermont" />
</map>

</td>
<td valign="top">

<div style="text-align:left; width:412px; height:362px; border:1px solid #999999;padding:10px;background-color:white; overflow:auto;margin-left:5px;" id="states"><span>Click a state to the right to see where that state's haunted places are.</span></div></td>

So what happens is you click on a state and it will show what's under that states line inside this JS file:

http://www.pxlcreations.com/paraguide/map.js

That works fine but if I try and put lots of text inside it, it won't work. I have to put each state inside this and here's what alabama looks like:

http://www.pxlcreations.com/paraguide/alabama.html

So here's a quick recap. If I try and put the Albany data into the JS file, it won't show. I even tried this:

Code:

<!--#include virtual='alabama.html'-->

But that didn't work either. Thanks in advance!

I'm having some problems hiding a div block and displaying another one.

this is my first attempt and creating something with JavaScript with out using a tutorial or anything so i would really appreciate any help, so i can learn

what i want is to have a div block display initially so when a user goes to the page they see the registration form, but if they already have an account they can just click a link that says log in and the registration form hides and the login form shows.

However right now its only hiding both and not displaying anything when the link is clicked

Here's the javascript code i'm using

Code:

<script type="text/javascript">  
function toggleview(id) {  
	
	var login = document.getElementById(id);
	var regsiter = document.getElementById(id);
	
	if(id == 'login' )
		login.style.display == 'block';
		regsiter.style.display == 'none';
	
}  
</script>

And here is what my link looks like

Code:

<h4><a href="#" onclick="toggleview('login')">Allready Have an Account?</a></h4>

my javascript clock suddenly disappeared. I don't know what happened. It's an external file. I have<script language="javascript" src="main.js"></script>
in the head section of my html and the .js looks like this but it's not showing up. I haven't made any changes unless I'm just remembering wrong

function startTime()
{
var now = new Date();
var h=now.getHours();
var min=now.getMinutes();
var s=now.getSeconds();
var ampm=(now.getHours()>11)?"PM":"AM";
var d=now.getDay()
var y=now.getFullYear()
var mon=now.getMonth()
var dm=now.getDate()

if (h>12) h-=12;
if (h==0) h=12;
if (min<10) min="0"+m;
if (s<10) s="0"+s;
if (dm<10) dm="0"+dm;

if (d==0) d="Sun";
if (d==1) d="Mon";
if (d==2) d="Tues";
if (d==3) d="Wed";
if (d==4) d="Thurs";
if (d==5) d="Fri";
if (d==6) d="Sat";

mon+=1;

document.getElementById("time").innerHTML=h+":"+min+":"+s+""+ampm+" "+d+" "+mon+" "+dm+" "+y;

t=setTimeout('startTime()',1000);
}
function checkTime(i)
{
if (i<10)
{
i="0" + i;
}
return i;
}

Help. How do I show the below JavaScript code to each unique visitor only once per day or any amount of days I want to set?

PHP Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
    <title>Untitled</title>
</head>

<body>

<!-- this goes anywhere in the root of the -->
<div id="slideIn" style="position:absolute; width: 720px; height: 320px; left: 0; top: -600px; z-index: 100; border: 1px solid gray; padding: 20px; font-family: 14px Verdana, sans-serif, Tahoma, Arial; font-color: black;"
    <div style="text-align:right"><input type="button" value="CLOSE" onclick="f_slideOut()" style="background: black; color: white; border: 2px solid #dcdcdc;"></div>
This is where the content goes blah blah
Blah Blah
Blah Blah

Please help :(
</div>
<div id="slideInShade" style="position:absolute;z-index:99;visibility:hidden;"></div>
<script>
var s_userAgent = navigator.userAgent.toLowerCase(),
    s_location = String(window.location).toLowerCase(); // copyright protection

var b_mac = s_userAgent.indexOf('mac') != -1,
    b_ie5    = s_userAgent.indexOf('msie 5') != -1,
    b_ie6    = s_userAgent.indexOf('msie 6') != -1 && s_userAgent.indexOf('opera') == -1,
    b_ieMac  = b_mac && b_ie5,
    b_safari = b_mac && s_userAgent.indexOf('safari') != -1,
    b_opera6 = s_userAgent.indexOf('opera 6') != -1;

var e_slideIn = document.getElementById('slideIn');
var e_slideInShade = document.getElementById('slideInShade');

function f_slideIn() {
    if (!window.e_slideIn) return;
    var n_width  = e_slideIn.offsetWidth;
    var n_height = e_slideIn.offsetHeight;
    var n_left   = (f_clientWidth() - n_width) / 2;
    var n_top    = parseInt(e_slideIn.style.top);
    var n_moveTo = (f_clientHeight() - n_height) / 2;

    e_slideIn.style.left = n_left + 'px';
    e_slideIn.style.visibility = 'visible';
    f_customShade(n_width, n_height, n_left, n_top);
    e_slideInShade.style.visibility = 'visible';

    n_slideMove (n_top, n_moveTo);
}

function n_slideMove (n_top, n_moveTo) {
    n_inc = Math.round((n_moveTo - n_top) / 20);
    if (!n_inc) return;
    n_top += n_inc;
    f_customShade(null, null, null, n_top);
    e_slideIn.style.top  = n_top + 'px';
    setTimeout('n_slideMove(' + n_top + ',' + n_moveTo + ')', 10);
}

function f_slideOut() {
    if (!window.e_slideIn) return;
    e_slideIn.style.visibility = 'hidden';
    e_slideInShade.style.visibility = 'hidden';
}

function f_clientWidth() {
    if (typeof(window.innerWidth) == 'number')
        return window.innerWidth;
    if (document.documentElement && document.documentElement.clientWidth)
        return document.documentElement.clientWidth;
    if (document.body && document.body.clientWidth)
        return document.body.clientWidth;
    return null;
}
function f_clientHeight() {
    if (typeof(window.innerHeight) == 'number')
        return window.innerHeight;
    if (document.documentElement && document.documentElement.clientHeight)
        return document.documentElement.clientHeight;
    if (document.body && document.body.clientHeight)
        return document.body.clientHeight;
    return null;
}
function f_customShade (n_width, n_height, n_left, n_top) {
    if (!e_slideInShade) return;
    if (n_width != null) e_slideInShade.style.width = (n_width + 8) + 'px';
    if (n_left != null) e_slideInShade.style.left = (n_left - 1) + 'px';
    e_slideInShade.style.top = (n_top - 1) + 'px';
    if (!e_slideInShade.innerHTML) {
        if (b_ie5 || b_ie6)
            e_slideInShade.innerHTML = '<table cellpadding="0" cellspacing="0" border="0" width="100%"><tr><td rowspan="2" colspan="2" width="6"><img src="images/pixel.gif"></td><td width="7" height="7" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/shade_tr.png\', sizingMethod=\'scale\');"><img src="images/pixel.gif"></td></tr><tr><td height="' + (n_height - 7) + '" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/shade_mr.png\', sizingMethod=\'scale\');"><img src="images/pixel.gif"></td></tr><tr><td width="7" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/shade_bl.png\', sizingMethod=\'scale\');"><img src="images/pixel.gif"></td><td style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/shade_bm.png\', sizingMethod=\'scale\');" height="7" align="left"><img src="images/pixel.gif"></td><td style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/shade_br.png\', sizingMethod=\'scale\');"><img src="images/pixel.gif"></td></tr></table>';
        else
            e_slideInShade.innerHTML = '<table cellpadding="0" cellspacing="0" border="0" width="100%"><tr><td rowspan="2" width="6"><img src="images/pixel.gif"></td><td rowspan="2"><img src="images/pixel.gif"></td><td width="7" height="7"><img src="images/shade_tr.png"></td></tr><tr><td background="images/shade_mr.png" height="' + (n_height - 7) + '"><img src="images/pixel.gif"></td></tr><tr><td><img src="images/shade_bl.png"></td><td background="images/shade_bm.png" height="7" align="left"><img src="images/pixel.gif"></td><td><img src="images/shade_br.png"></td></tr></table>';
    }
}
f_slideIn();
</script>

</body>
</html> 

Hi guys, im new to forums and need some help with my website.
I have embed a flash player known as: JW player into my website and put it into a div.
Now my problem is I want javascript to hide the div containing the flash player for atleast a few seconds to display a loading image.gif.
How would I set this up?
Im not to familiar about using javascript so im not sure if its even possible.
Anways thx for any help ore suggestions related to this subject.

css:


Code:

        #nav{
                width: 960px;
                margin: 0 auto;
            }
            ul li{
                float: left;
                margin-right:50px;
                list-style: none;
            }
      .sub-menu{
          display: none;
    
      }

jquery code:



Code:

              $(function(){
                ("#nav ul li").hover(function() {
                (".sub-menu").css("display","block");
       });

html code:

Code:

 <div id="nav">
      <div class="left"></div>
      <div class="right"></div>
      <ul>
        <li><a href="/" class="current">Home</a></li>
        <li><a href="/cpanel.html" class="">cPanel</a>
          <div class="sub-menu">
              <h2>test</h2>
              <p>
                  <a href="#">test</a> <a href="#">test</a> <a href="#">test<</a>
              </p>
                <p>
                  <a href="#">test</a> <a href="#">test</a> <a href="#">test<</a>
              </p>
          </div>

i am sorry, i am new of jquery.i want to show the sub nav part when the mouse hover on the `li` part. but my code doesn't work.how to correct it. thank you

Hello Friends,

I would like to get a div to show when a button has been clicked. I would like the div to be hidden when the page loads, and only to show when the button has been clicked. The button works - it hides and shows the div when clicked - but the div shows when the page loads when I want it to be hidden.

This is the code I have:

Code:

<script language="JavaScript">
function setVisibility(id) {
if(document.getElementById('bt1').value=='Cancel'){
document.getElementById('bt1').value = 'Change Currency';
document.getElementById(id).style.display = 'none';
}else{
document.getElementById('bt1').value = 'Cancel';
document.getElementById(id).style.display = 'inline';
}
}
</script>

Body:

Code:

<div id="currency"><input type=button name=type id='bt1' value='Change Currrency' onclick="setVisibility('sub3');";> 
</div>

I am still learning Javascript, any advice would be greatly appreciated.

Thank you.

Hello, I'm trying to have a div be hidden on loading the page but when you click a link it will show the div... here's code I have but it doesn't show when you click the link...

<script type="text/javascript">
function show(){
document.getElementById(test).style.display="block";
}

</script>

<div id="test" style="display:none;">
<p>Some text</p>
</div>


<a href="#" onclick="show(); return false;">Show</a>

Hi all,

Check this code:
PHP Code:
<a>text</a>
<div id="pkg">pkg</div>
<div id="table_pkg">table_pkg</div> 


I'd like to show table_pkg and hide pkg when I click on <a>text</a>.
How can I do?

Thank you very much