JavaScript - Page Not Working
Hi,
I have a page here http://95.131.66.39/~pestcont/autosearch/form_new.html As you will see in the product model number once you start typing the page looks up the info from the database. The problem was the page was very long so i have taken the javascript and placed it in a seperate file, however now the auto look up doesn't work and i can not work out why. The second page is he http://95.131.66.39/~pestcont/autosearch/new_form.html Any help would be appreciated. thanks Similar TutorialsThe golf ball is supposedly to come out and bounce across the screen and land in the word golf. Code: <html> <head> <!-- New Perspectives on JavaScript Tutorial 4 Case Problem 1 The Golf Page Author: Cheryl Ashworth Date: July 12, 2010 Filename: golfpage.htm Supporting files: ball.gif, clouds.jpg, golf.js, golfer.gif, styles.css --> <title>The Golf Page</title> <link href="styles.css" rel="stylesheet" type="text/css" /> <script src="golf.js" type="text/javascript"></script> <script type="text/javascript"> var x = new Array(-395, -389, -383, -377, -371, -365, -359, -353, -346, -340, -334, -328, -322, -316, -310, -304, -297, -291, -285, -279, -273, -267, -261, -255, -248, -242, -236, -230, -224, -218, -212, -206, -199, -193, -187, -181, -175, -169, -163, -157, -150, -144, -138, -132, -126, -120, -114, -108, -101, -95, -93, -91, -88, -86, -83, -81, -78, -76, -73, -71, -69, -66, -64, -61, -59, -56, -54, -51, -49, -47, -44, -42, -39, -37, -34, -32, -29, -27, -24, -22, -20, -17, -15, -12, -10, -7, -5, -2, 0); var y = new Array(-300, -300, -300, -299, -298, -297, -296, -294, -292, -290, -288, -285, -282, -279, -276, -272, -268, -264, -260, -255, -250, -245, -240, -234, -228, -222, -216, -209, -202, -195, -188, -180, -172, -164, -156, -147, -138, -129, -120, -110, -100, -90, -80, -69, -58, -47, -36, -24, -12, 0, -5, -10, -14, -18, -22, -25, -29, -32, -34, -37, -39, -41, -43, -45, -46, -47, -48, -48, -48, -48, -48, -48, -47, -46, -45, -43, -42, -40, -37, -35, -32, -29, -26, -23, -19, -15, -11, -6, 0); var index=0; function moveBall() { if (index<=x.length-1) <!-- length check --> { placeIt("Ball", x[index], y[index]); index++; setTimeout("moveBall()",5) } else { showIt("Slogan"); } </script> <!-- External Javascripts --> <script src="Golf.js"></script> </HEAD> <!-- Body --> <BODY onLoad="moveBall()"> <!-- Title --> <DIV ID="Title" STYLE="padding-left:395;padding-top:260;padding-bottom:0; border-style:solid; border-width:1 3 3 1; border-color:blue; background-color:rgb(0,255,0)"> THE G<SPAN ID="Ball"STYLE="position:relative;left:0;top:0"><IMG SRC="Ball.gif" BORDER=0></SPAN>LF PAGE </DIV> <!-- Slogans --> <DIV ID="Slogan" STYLE="color:black; font-family: Times New Roman, Times, serif; font-style:italic; font-weight:bold; position:absolute; left:120; top:100; z-index:2;visibility:hidden"> Your Online Source of Golf Equipment </DIV> <DIV ID="Slogan2" STYLE="color:white; font-family: Times New Roman, Times, serif; font-style:italic; font-weight:bold; position:absolute; left:121; top:101; z-index:1;visibility:hidden"> Your Online Source of Golf Equipment </DIV> <!-- End --> </BODY> </HTML> */ JS Script Code: Function List: placeIt(id, x, y) Places the id object at the coordinates (x, y) showIt(id) Shows the id object by setting the object visibility to "visible" getFontSize(id) Retrieves the font size of the id object setFontSize(id, fs) Sets the font size of the id object to fs changeFontSize(id, dfs) Changes the font size of the id object by dfs */ function placeIt(id, x, y) { // Places the id object at the coordinates (x,y) object=document.getElementById(id); object.style.left=x+"px"; object.style.top=y+"px"; } function getFontSize(id) { // Returns the font size of the object with the value id object=document.getElementById(id); size=parseInt(object.style.fontSize); return(size); } function setFontSize(id, ptsize) { // Sets the font size of the object with the value id object=document.getElementById(id); object.style.fontSize = ptsize + "pt"; } function changeFontSize(id, dfs) { // Returns the font size of the object with the value id fs = getFontSize(id); setFontSize(id, fs+dfs); }CSS */ Code: This file contains styles used in the golfpage.htm file Code: body {font-family:Arial, Helvetica, sans-serif; font-size: 18pt; color:blue; background-image: url(clouds.jpg)} #Title {position: absolute; left:395px; top:260px} #Ball {position:relative; top:0px; left:0px} #Ball img {border-width: 0px} #box {width:600px; height: 250px; border-style:solid; border-width:1 4 4 1; border-color:blue; background-color:rgb(0,255,0); text-align: center} #slogan {visibility: hidden; position: relative; top: 50px; color:black; font-family: Times New Roman, Times, serif; font-style:italic; font-weight:bold} */ When i click on an image, it just opens in a new tab, lightbox doesn't work?! PHP Code: $jq_add_div_strings = ''; $jq_div_classes_csv = ''; $counter = 0; //startarray $bikearray = array(); //$query = "SELECT * FROM wmb_members ORDER BY rsDatetaken DESC LIMIT $offset, $rowsPerPage"; //$query = "SELECT * FROM wmb_members LEFT JOIN wmb_pics ON wmb_pics.UserID=wmb_members.UserID ORDER BY rsDatetaken DESC LIMIT $offset, $rowsPerPage"; $query = "SELECT M.*, P.picid, P.filename " . " FROM ( SELECT * " . " FROM wmb_members " . " ORDER BY rsDateTaken DESC, UserID ASC " . " LIMIT " . $offset . "," . $rowsPerPage . " ) AS M " . " LEFT JOIN wmb_pics AS P " . " ON M.UserID = P.UserID " . " ORDER BY M.rsDateTaken DESC, M.userID ASC, P.picid ASC;"; //$query = "SELECT wmb_members.*, wmb_pics.* FROM wmb_members INNER JOIN wmb_members ON wmb_members.UserID=wmb_pics.UserID ORDER BY rsDatetaken DESC LIMIT $offset, $rowsPerPage"; $result = mysql_query($query); $num_rows = mysql_num_rows($result); //echo "DEBUG SQL: " . $query . "<HR>"; //echo "DEBUG: query returned " . $num_rows . " rows<hr>\n"; // remember the UserID of the prior row ... no prior row to start, so blank: $priorid = ""; while ($row = mysql_fetch_assoc($result)) { // get the UserID for the current row in the results $curid = $row['UserID']; // if not the same as the prior row, then create a new set of data in the bikearray: if ( $curid != $priorid ) { // I'm guessing that this stuff goes he $jq_add_div_strings .= "animatedcollapse.addDiv('jason$counter', 'hide=1', 'fade=1,height=180px')\n"; $jq_div_classes_csv .= "'jason$counter',"; // on firmer footing here...this should be right: // store main data array $bikearray[$curid]['UserID'] = $curid; $bikearray[$curid]['rsBikeman'] = $row['rsBikeman']; $bikearray[$curid]['rsBikemod'] = $row['rsBikemod']; $bikearray[$curid]['rsBikeyear'] = $row['rsBikeyear']; $bikearray[$curid]['rsBikecolor'] = $row['rsBikecolor']; $bikearray[$curid]['rsDatetaken'] = $row['rsDatetaken']; $bikearray[$curid]['rsLocation'] = $row['rsLocation']; $bikearray[$curid]['rsOtherinfo'] = $row['rsOtherinfo']; $bikearray[$curid]['rsLocpostcode'] = $row['rsLocpostcode']; $bikearray[$curid]['rsLocked'] = $row['rsLocked']; $bikearray[$curid]['lockType'] = $row['lockType']; $bikearray[$curid]['frontSus'] = $row['frontSus']; $bikearray[$curid]['rearSus'] = $row['rearSus']; $bikearray[$curid]['frontLight'] = $row['frontLight']; $bikearray[$curid]['rearLight'] = $row['rearLight']; $bikearray[$curid]['bikeBell'] = $row['bikeBell']; $bikearray[$curid]['bikeBasket'] = $row['bikeBasket']; $bikearray[$curid]['bikeBag'] = $row['bikeBag']; $bikearray[$curid]['rsUser'] = $row['rsUser']; $bikearray[$curid]['rsEmail'] = $row['rsEmail']; // How do you specify an empty array in PHP?? $bikearray[$curid]['pictures'] = array(); // This is how many pictures there are for current UserID: $piccount = 0; $counter++; // and change priorid for the match test at top of loop $priorid = $curid; } // then regardless if new userid or a repeated userid... // see if this record has a valid (non null, non blank) filename: $pic = $row['filename']; if(!empty($pic)) { // yes...a valid filename...so add it to the array $bikearray[$curid]['pictures'][$piccount] = $pic; // and count it ++$piccount; } } $jq_div_classes_csv = rtrim($jq_div_classes_csv,","); $bikearray_html = array(); $i = 0; foreach ($bikearray as $id=>$DETAILS) { @$bikearray_html[$i] .= "<div id=\"pubholder\" class=\"wrap\">"; $bikearray_html[$i] .= "<div class=\"entry_header\">"; $bikearray_html[$i] .= "<a href=\"javascript:animatedcollapse.show('jason$i')\" >show more details ></a> "; $bikearray_html[$i] .= "<a href=\"javascript:animatedcollapse.hide('jason$i')\" >hide ^</a>"; $bikearray_html[$i] .= "<div><b>".$DETAILS['rsUser']."'s ".$DETAILS['rsBikeman']." ".$DETAILS['rsBikemod']."</b> was taken from <b>".$DETAILS['rsLocation']."</b> on <b>".$DETAILS['rsDatetaken']."</b></div>"; $bikearray_html[$i] .= "<div id=\"jason$i\">\n"; $bikearray_html[$i] .= "</br></br>"; $bikearray_html[$i] .= "<b>Owners email:</b> <a href=\"mailto:".$DETAILS['rsEmail']."\"> ".$DETAILS['rsEmail']."</a></br>"; $bikearray_html[$i] .= "<b>Bike year:</b> ".$DETAILS['rsBikeyear']." </br>"; $bikearray_html[$i] .= "<b>Bike color:</b> ".$DETAILS['rsBikecolor']." </br>"; $bikearray_html[$i] .= "<b>Locked:</b> ".$DETAILS['rsLocked']." </br>"; $bikearray_html[$i] .= "<b>Lock type:</b> ".$DETAILS['lockType']." </br>"; $bikearray_html[$i] .= "<b>additional extras:</b></br> <i> Front suspension: ".$DETAILS['frontSus']."</br> Rear suspension: ".$DETAILS['rearSus']."</br> Front Light: ".$DETAILS['frontLight']."</br> Rear Light: ".$DETAILS['rearLight']."</br> Bell: ".$DETAILS['bikeBell']."</br> Basket: ".$DETAILS['bikeBasket']."</br> Bag: ".$DETAILS['bikeBag']."</i></br>"; $bikearray_html[$i] .= "<b>Other info:</b> ".$DETAILS['rsOtherinfo']." </br>"; if(!empty($DETAILS['pictures'])){ foreach($DETAILS['pictures'] as $piccount => $pic){ [B]$bikearray_html[$i] .= "<a href=\"upload/".$pic."\" rel=\"lightbox[bikes]\" border=\"0\"><img src=\"upload/".$pic."\" height=\"75\" width=\"100\" \></a>[/B] "; // do what you want here } }else{ // no picture for this user } $bikearray_html[$i] .= "</br>"; $bikearray_html[$i] .= "</div>\n"; $bikearray_html[$i] .= "</div>\n"; $bikearray_html[$i] .= "</div>\n"; $i++; } mysql_close($link); ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html;charset=iso-8859-1" /> <title>Stolen Bikes, mountain bikes, bmx bikes, Other cycles and bicycles in the UK</title> <meta name="description" content="Website to help people get their stolen bikes back" /> <meta name="keywords" content="stolen, thief, mountain bike, bicycle, UK, nicked, MTB" /> <meta name="Content-Language" content="en-gb" /> <meta name="robots" content="FOLLOW,INDEX" /> <meta name="revisit-after" content="2 days" /> <meta name="copyright" content="www.wheresmybike.co.uk" /> <meta name="author" content="www.mutecms.com - Professional web site design in the south uk, worthing, brighton" /> <meta name="distribution" content="Global" /> <meta name="resource-type" content="document" /> <script type="text/javascript"> swfobject.registerObject("myId", "9.0.0", "expressInstall.swf"); </script> [B]<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />[/B] <link rel="stylesheet" type="text/css" href="css/reset-style.css" /> <link rel="stylesheet" type="text/css" href="css/sitestyle.css" /> <link rel="stylesheet" type="text/css" href="css/default.css" /> <script type="text/javascript" src="javascript/prototype.js"></script> <script type="text/javascript" src="javascript/effects.js"></script> <script type="text/javascript" src="javascript/lightwindow.js"></script> [B]<script type="text/javascript" src="js/swfobject.js"></script> <script type="text/javascript" src="js/external.js"></script> <script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>[/B] <script type="text/javascript" src="js/lightbox.js"></script> <script type="text/javascript" src="js/jva.js"></script> <script type="text/javascript" src="jquery-1.2.2.pack.js"></script> <script type="text/javascript" src="animatedcollapse.js"></script> <script type="text/javascript"> animatedcollapse.init() <?php echo $jq_add_div_strings; ?> </script> </head> <body> <div id="doc"> <div id="hd"> <h1>Where's my bike?</h1> <div class="manbike"></div> <div class="cctv"></div> <ul> <li><a href="default.php" title="Homepage and News">home</a></li> <li><a href="bike.html" title="Featured Bike">the bike</a></li> <li><a href="thieves.html" title="Featured Thief">the thief</a></li> <li><a href="cctv.html" title="CCTV Footage">the CCTV</a></li> <li><a href="signup.php" title="Sign Up">sign up</a></li> <li><a href="stolen-bikes.php" title="Stolen Bikes">stolen bikes</a></li> <li><a href="login.php" title="Login">login</a></li> <li><a href="yoursay.php" title="Have your say">your say</a></li> <li><a href="forum.html" title="Forum">forum</a></li> </ul> </div> <div id="bd"> <div class="yui-g"> <div class="topcontent"> </div> <a name="fb_share" type="button_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script> <a href="javascript:animatedcollapse.show([<?php echo $jq_div_classes_csv; ?>])">show all<img src="images/down.gif" border="0" /></a> <a href="javascript:animatedcollapse.hide([<?php echo $jq_div_classes_csv; ?>])"><img src="images/up.gif" border="0" />hide all</a> <?php foreach ($bikearray_html as $html) echo $html; ?> <?php echo $first.$prev; ?> Showing page <strong><?php echo $pageNum;?></strong> of <strong><?php echo $maxPage;?></strong> pages <?php echo $next.$last; ?> </div> </div> <div id="ft">Site created by: <a href="http://www.jbiddulph.com">jbiddulph.com</a></div> </div> </div> <script type="text/javascript"> var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E")); </script> <script type="text/javascript"> try { var pageTracker = _gat._getTracker("UA-2434589-16"); pageTracker._trackPageview(); } catch(err) {}</script> </body> </html> http://www.wheresmybike.co.uk/stolen-bikes.php?page=2 Hi .. I should start off saying I dont know the first thing about java script programming. I have 3 scripts on one of my pages, the first script is for a slide animation, the second is a hover intent script and the third is a headline animation script. I know if I comment out the hover intent script, the first and third script work. So my question is how to get the hover intent script to work correctly and behave with the other 2 scripts on the page. I read your post on "on body load" or "runscripts" calls with 2 scripts but I could not find such calls in these 3 javascripts. The hover intent script does not do what I want it to do on any of the pages that I have installed it on. When you first load the page the menu items are sitting above the slideshow and when you hover your mouse over the navigation from left to right they sort of jump and its not until you get to the contact image at the end that the slideshow moves into the correct position and then if you go back and hover over the home image the slideshow jumps up and down. The three script page is http://www.kimberleywebdesign.com.au/test/reviews.html Thanks in advance for your valuable time. Hey: I have two javascripts on my page but one isn't showing with both codes in page. [CODE]<script type="text/javascript" src="js/image-slideshow.js"></script>[ICODE] The above code is for the image slide. When this is in the html the other one doesn't work (a text changer). The wbesite is http://www.uwics.com/constitution.htm There is no text at the top of the page currently. If you check Home you'll see how it should be. Any help would be greatly appreciated. Thank you, Mitka I have a tab that scrolls through images in a frame through javascript. It works in one page, but not the other. I'm trying to get the page not working to work, obviously. I also have checked and temporarily fixed validation errors, and that doesn't help. Working page: www.happydogwebproductions.com Same images in different page: http://www.happydogwebproductions.co...--css-websites I've been trying the "BDirect lists" on both pages. Java: "new SimpleSlide". Just when I think I am close, I can't get it to work. Going mental. Thanks for any help Hi All I have page peel on my site www.lightuplondon.com which works in firefox but not in internet explorer, but can't work out why? If any one can help me with this it would be much appreciated. Thanks Stewart I know this is a common problem, and each slide show script is a bit different and I can't get this to work exactly right: http://www.javascriptkit.com/script/...ifferent.shtml I've got two tables containing mouseover image "slide" shows - numbered sequentially but both are on the same index.html page. One image show comes up with the first navigation link, the second image show comes up with the second navigation link. The first image show works, the second doesn't - could you tell me what is causing that. there is a javascript glider that requires them both to be on the same page. link to the page here . . . http://www.sunupdesignbuild.com/NEW/index.html appreciate your help thank you T Hey guys, On my personal website, I just created a rollover image gallery using Javascript. Each time you roll over a thumbnail, the image above changes to the corresponding thumbnail image. http://www.thelittlelizzard.com/Bahamas.html After spending hours getting that to work properly, my footer is now showing as one huge blue link. I believe I'm forgetting to close a tag somewhere? Being new to Javascript, I don't have a clue what I am forgetting to close to cause my footer to become a huge blue link like that. Does anyone have any ideas? Here is a copy of the code of my body section where I believe the problem may be... Code: <p>Where we stayed: <a href="http://www.starwoodhotels.com/sheraton/property/overview/index.html?propertyID=3067" onclick="window.open(this.href);return false;">Radisson Cable Beach Resort</a> (Now called Sheraton Nassau Cable Beach): </p> <p>Dates we travelled: March 2004, 2005 and 2006</p> <p>Flight Time from New York: 2.5 hours</p> <br /><br /> <div id="divcenter"> <p><img align="center" border="0" src="Bahamas/bahamas.jpg" style="border-right: 1 solid #006666" name="altimg" width="548" height="316" /> </p> <p> <a onmouseover="on('image1');" onmouseout="off('image1')"> <img src="Bahamas/bahamas.jpg" width="45" height="45"></a> <a onmouseover="on('image2');" onmouseout="off('image2')"> <img src="Bahamas/bahamas-1.jpg" width="45" height="45"></a> <a onmouseover="on('image3');" onmouseout="off('image3')"> <img src="Bahamas/bahamas-2.jpg" width="45" height="45"></a> <a onmouseover="on('image4');" onmouseout="off('image4')"> <img src="Bahamas/bahamas-3.jpg" width="45" height="45"></a> <a onmouseover="on('image5');" onmouseout="off('image5')"> <img src="Bahamas/bahamas-4.jpg" width="45" height="45"></a> <a onmouseover="on('image6');" onmouseout="off('image6')"> <img src="Bahamas/bahamas-5.jpg" width="45" height="45"></a> <a onmouseover="on('image7');" onmouseout="off('image7')"> <img src="Bahamas/bahamas-6.jpg" width="45" height="45"></a> <a onmouseover="on('image8');" onmouseout="off('image8')"> <img src="Bahamas/bahamas-7.jpg" width="45" height="45"></a> <a onmouseover="on('image9');" onmouseout="off('image9')"> <img src="Bahamas/bahamas-8.jpg" width="45" height="45"></a> <a onmouseover="on('image10');" onmouseout="off('image10')"> <img src="Bahamas/bahamas-9.jpg" width="45" height="45"></a> <a onmouseover="on('image11');" onmouseout="off('image11')"> <img src="Bahamas/bahamas-10.jpg" width="45" height="45"></a> <a onmouseover="on('image12');" onmouseout="off('image12')"> <img src="Bahamas/bahamas-11.jpg" width="45" height="45"></a> <a onmouseover="on('image13');" onmouseout="off('image13')"> <img src="Bahamas/bahamas-12.jpg" width="45" height="45"></a> <a onmouseover="on('image14');" onmouseout="off('image14')"> <img src="Bahamas/bahamas-13.jpg" width="45" height="45"></a> <a onmouseover="on('image15');" onmouseout="off('image15')"> <img src="Bahamas/bahamas-14.jpg" width="45" height="45"></a> <a onmouseover="on('image16');" onmouseout="off('image16')"> <img src="Bahamas/bahamas-15.jpg" width="45" height="45"></a> <a onmouseover="on('image17');" onmouseout="off('image17')"> <img src="Bahamas/bahamas-16.jpg" width="45" height="45"></a> <a onmouseover="on('image18');" onmouseout="off('image18')"> <img src="Bahamas/bahamas-17.jpg" width="45" height="45"></a> <a onmouseover="on('image19');" onmouseout="off('image19')"> <img src="Bahamas/bahamas-18.jpg" width="45" height="45"></a> <a onmouseover="on('image20');" onmouseout="off('image20')"> <img src="Bahamas/bahamas-19.jpg" width="45" height="45"></a> <a onmouseover="on('image21');" onmouseout="off('image21')"> </div> </div> <div id="footer"> <p>© 2009 TheLittleLizzard.com<br> All images and content on this website are owned by The Little Lizzard.</br> </p> <p>All rights reserved. </p> <p><a href="http://www.TheLittleLizzard.com">Home</a> <a href="http://www.ScreamingLizzardProductions.com" onclick="window.open(this.href);return false;">Site Design</a></p> </div> </div> </body> Thanks again for any help. This is one of the only places I get real answers that solve my problems! I am trying to use these two js codes in one page: http://acrisdesign.com/2010/03/jquer...on-hoverclick/ http://www.huddletogether.com/projects/lightbox2/ They both work perfectly fine except when both linked up at the same time. Only the last one will work. I've tried to find how the codes are working when the page loads in order to fix that problem but I cant figure it out for these two specific codes. Thanks. Hi all, I have a script that checks and unchecks all boxes depending on the current state of the box. I have used it on one page and it works perfectly fine... copied it over to a new page where I wanted to reuse and can't get it to work. Code: <script type="text/javascript"> function check_all(form, input_name, self){ if(!input_name){ return; } var input = form.getElementsByTagName('input'); for(var i = 0; i < input.length; i++){ if(input[i].name.indexOf(input_name)!=-1){ input[i].checked = self.checked; } } } </script> Code: <input type="checkbox" name="notimportant" onclick="check_all(document.form1, 'check', this)" value="test" /><b>All</b> Code: <input type="checkbox" name="check_list[]" value="<?php echo $row2['email'];?>"> Code: <form name="form1" action="emailspecificcandidates.php" method="post"> As I say this script works perfectly on another page, and as far as i can see i have copied everything over correctly. Can anyone spot anything wrong? Many thanks, Greens85 EDIT: I think this may be broken because of the way I presenting it with php on my page... i copied a seperate entity of the script onto the page and it worked first time. hi, When I navigate to a page with Ajax on my iphone or ipad, it doesn't show up, page is just blank, I have checked for errors and there is no errors?! here is my Ajax code Code: function datecheckFunction(){ var datecheckRequest; // The variable that makes Ajax possible! try{ // Opera 8.0+, Firefox, Safari datecheckRequest = new XMLHttpRequest(); } catch (e){ // Internet Explorer Browsers try{ datecheckRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try{ datecheckRequest = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e){ // Something went wrong alert("Your browser broke!"); return false; } } } // Create a function that will receive data sent from the server datecheckRequest.onreadystatechange = function(){ if(datecheckRequest.readyState == 4){ var ajaxDisplay = document.getElementById('ajaxDiv'); ajaxDisplay.innerHTML = datecheckRequest.responseText; } } var datepicker = document.getElementById('datepicker').value; var queryString = "?datepicker=" + datepicker; //Add the following line datecheckRequest.open("GET", "http://www.affordableappliancerepairs.co.uk/admin/checkdate.php" + queryString, true); datecheckRequest.send(null); } I hope I have this post in the right place! Any help would be very much appreciated... I have a feature on my website that allows users to choose the website background (using alternate css sheets) and then uses an externally linked javascript file to store the background choice as a cookie so it is consistent throughout the website. This works perfectly locally (i.e. when previewing my website on my computer) but now it is uploaded to my host it doesn't appear to be working. (with the same browser) My javascript is he http://www. b r p - e n v .com/javascript/backgroundchange.js (with no spaces) The website that the javascript file is linked to is http://www. b r p - e n v .com (with no spaces) In the head I have: <script type="text/javascript" src="../javascript/backgroundchange.js"></script> ...then I have: <body onload="set_style_from_cookie()"> ...and for users to choose which background: <form> <input type="image" src="../images/white-background-thumb.jpg" onclick="switch_style('bg1');return false;" name="theme" value="White" id="bg1"> etc... </form> My problem is: The background reverts back to the default when moving to a different page. This would indicate that the background choice is not being saved in cookies. But this works locally! I have tried putting the javascript directly onto each page but I still had the same problem. I hope someone can help, I will be so grateful if I can get this to work. Many thanks indeed! Ok, here's the page as it is right now: http://www.crackin.com/dev/index.php The paganation for the top 3 images is Sweet Pages: http://tutorialzine.com/2010/05/swee...tion-solution/ The content loading below is a page-replace script I got he http://css-tricks.com/dynamic-page-replacing-content/ And I'm also trying to integrate shadowbox (or lightbox, whichever will work) into the lower set of images. I have 2 problems right now I can't figure out, and I'm sure it somehow has to do with the fact I'm trying to mash 3 different JS addons into a single page, I'm still pretty new to this whole JS thing... First problem I'm having is that IE7 and Opera don't like the links in the upper images. Clicking a gallery image does not load the associated page below from those 2 browsers, however IE8 and FF seem to work fine. Second problem is getting shadowbox/lightbox to work on those lower images. I tried a couple different things but main thing I did is make sure the script is actually working by setting the header text to a link with shadowbox attached and that worked. That same link doesn't work when applied to the lower images (loads image in new window). Lightbox does the same thing. Thanks for any help. Hi All, I have two sites using zeroclipboard (hosted at google code) one works only in firefox and barely, the other is not working at all. It does use Flash, but I think the issue is on the js side of things. On both links, clicking the filename below the thumbnail will copy and add the link as an IMG code to a div below. *working* link http://pics.boasbysatyra.com/access/spiders.php This one only works in FF, and the clip area is offset badly. Here is the template for the zc code: Code: <div class="photo" style="float: left; padding: 4px;"> <div class="exif"><a href="[~41~]?dir=[+images_dir+]&file=[+filename+]" rel="shadowbox[exif_[+content_id+]]" title="exif data for [+filename+]" alt="exif data for [+filename+]">EXIF Data</a></div> <a class="thumb" rel="shadowbox[[+content_id+]]" href="[+images_dir+][+filename+]" title="[+title+] | [+description+]"> <img src="[+thumbs_dir+][+filename+]" alt="[+title+]" /> </a> <div class="filecode" id="d_clip_button[+filename+]">[+filename+] <script language="JavaScript"> var clip = new ZeroClipboard.Client(); clip.setText( 'http://pics.boasbysatyra.com[+images_dir+][+filename+]' ); clip.glue( 'd_clip_button[+filename+]' ); clip.addEventListener( 'onComplete', my_complete ); function my_complete( client, text ) { $('.picklist').append('<div class="piclinks">[IMG]' + text + '[/IMG]</div>'); } </script> </div> </div> And the JS for the page: Code: var needRef; //flag for page reload function pEdit(){ needRef = 1; } Shadowbox.init({ handleOversize: "resize", modal: true, initialHeight: 32, initialWidth: 400, overlayOpacity: 0.85, onClose: function(){//check for reload flag and reload if (needRef == 1){window.location.href=window.location.href;} } }); ZeroClipboard.setMoviePath('/js/zc/ZeroClipboard10.swf'); function initMenu() { $('#menu ul').hide(); $('#menu ul:first').show(); $('#menu li a').click(function() { var checkElement = $(this).next(); if ((checkElement.is('ul')) && (checkElement.is(':visible'))) { //return false; } if ((checkElement.is('ul')) && (!checkElement.is(':visible'))) { $('#menu ul:visible').slideUp('normal'); checkElement.slideDown('normal'); return false; } }); } $(document).ready(function() { initMenu(); }); Now on to the totally broken one - it creates the elements required, but gives them a 0x0 area! http://jb.boasbysatyra.com/forum-pic...cs/nature.html Code: div class="photo" style="float: left; margin: 4px;"> <div class="exif"><a href="[~133~]?dir=[+images_dir+]&file=[+filename+]" rel="shadowbox[exif_[+content_id+]]" title="exif data for [+filename+]" alt="exif data for [+filename+]">EXIF Data</a></div> <a class="thumb" rel="shadowbox[[+content_id+]]" href="[+images_dir+][+filename+]" title="[+title+] | [+description+]"> <img src="[+thumbs_dir+][+filename+]" alt="[+title+]" /> </a> <div id="d_clip_container[+filename+]" style="position:relative; width: 120px; height: 0.5em;"> <div class="filecode" id="d_clip_button[+filename+]">[+filename+] <script language="JavaScript"> var clip = new ZeroClipboard.Client(); clip.setText( 'http://jb.boasbysatyra.com[+images_dir+][+filename+]' ); clip.glue( 'd_clip_button[+filename+]','d_clip_container[+filename+]' ); clip.addEventListener( 'onComplete', my_complete ); function my_complete( client, text ) { $('.picklist').append('<div class="piclinks">[IMG]' + text + '[/IMG]</div>'); } </script> </div> </div> </div> On this one I wrapped it as suggested on the zc site, I originally started with the code for the other site - it didn't work, so I went tweaking... Here is the JS: Code: var needRef; //flag for page reload function pEdit(){ needRef = 1; } Shadowbox.init({ handleOversize: "resize", modal: true, initialHeight: 32, initialWidth: 400, overlayOpacity: 0.85, onClose: function(){//check for reload flag and reload if (needRef == 1){needRef = 0; window.location.href=window.location.href;} } }); ZeroClipboard.setMoviePath('/js/zc/ZeroClipboard10.swf'); $(document).ready(function() { $(".dim img").fadeTo("slow", 0.65); $(".dim img").hover(function(){ $(this).fadeTo("slow", 1.0); },function(){ $(this).fadeTo("slow", 0.65); }); $('#mainContent').hide().fadeIn(1200); //When page loads... $(".tab_content").hide(); //Hide all content // $("ul.tabs li:first").addClass("active").show(); //Activate first tab // $(".tab_content:first").show(); //Show first tab content //On Click Event $("ul.tabs li").click(function() { $("ul.tabs li").removeClass("active"); //Remove any "active" class $(this).addClass("active"); //Add "active" class to selected tab $(".tab_content").hide(); //Hide all tab content var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content $(activeTab).fadeIn(); //Fade in the active ID content return false; }); }); (function($) { $(document).ready(function(){ $('.menu1').ptMenu(); $('.menu2').ptMenu({vertical:true}); }); })(jQuery); I have taken a look at this for a few days and tried many things with no luck, any help is appreciated. 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 have a usercontrol which get inputs from the user and show the slideshows. I have added jquery.js and jqfancytransitions.js to the control. when i apply the effects dynamically it is working on local iis but the same coding is not working on iis server. The link for the page is http://www.gloriatech.com/slideshow.aspx . Actually it display the images but no effects are applied. I also checked the js files, it is in right path only.When i checked this page in firebug , it shows the error which is " Sys is undefined". I dont know how to solve it. Can anyone help me? Thanx in advance. I want to implement a javascript function where a submit button will be submitted from the parent page each time I close a child page. Please let me know what I did wrong in my code and please elaborate your answer so that I could understand it better. Thank you so much for your help. I have the following jscript code but it is now working. Code: window.onunload = submitParent; function submitParent() { var doc = window.opener.document, theForm = doc.getElementById("finalForm"); theField = doc.getElementById("finalSelected"); theForm.submit(); theField.trigger('click'); } My form from the parent page is as follow. I want my jscript to just click on the submit button once. Code: <form id = "finalForm "name= "finalForm" method="POST" action=""> <input type="Submit" id = "finalSelected" name="finalSelected"/> I just wrote an essay to discover it had logged me out and I lost everything. Grrrrrrr. Here goes again, simplified this time. I've got a sticky footer at the bottom of the page and a spry collapsible panel which expands to reveal content on mouse over. The problem I'm facing is that the page doesn't scroll down with it, only the scroll bar gets larger to accommodate for a manual scroll down. This is kind of useless because the user might not even realise that there's extra content there in the first place if it's not automatic. My question is, what's the best javascript code to use to automatically scroll the page down when the spry tab is opened and where would I insert it? I've tried all morning with no success so far! Thanks, Nick, I'm copy pasting this post this time round, I don't trust this website now Hello. My goal is to load the JS for a specific element before displaying that element. I integrated a third part script, and it works well. I set the timer he The JS is in my heading as <script type="text/javascript" src="countdownpro.js"></script> About mid-body I have: <span id="countdown1">2010-07-20 00:00:00 GMT+00:00</span> which allows for the setting of a target date to countdown to. When the page first loads it shows the above long format target time, until the js/meta tags kick in to modify it to just show the actual countdown as 00:00:00. I have attached countdownpro.js to this post. I tried shifting the function CD_Init() to the top of the script, and also appended it inline with the .html. I tried setting the big external script to "defer", but neither arrangement worked. I also tried placing the src file right at the top. I appreciate your help. Hi, I am Aditya. I am explaining below the exact scenario where I need the help: I am developing a web application in which I need to integrate a javascript/html editor on some of the web pages and then provide 'Edit' buttons on those web pages so that users can edit the content on that partciular html/jsp page (like editing in wiki pages) and then, when they add some content and click on submit button, the new content should appear on the web page with all the formatting (i.e. bold, italics, color and so on) which was applied by user when he was entering the text. Now, I need help for the below issues: 1. Please suggest me a good javascript/html editor (freely downloadable) which I can use to integrate with my web pages. 2. Once the user has entered some content using the above javascript editor, how to make that content reach the server and update the corresponding web page. I am new to web development, so may be that these questions are too simple. But, I need some help from you. Waiting for your reply, Thanks, Aditya |