JavaScript - Page Peel Not Working In Explorer?
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 Similar TutorialsI am using the page peel code below on my social network site. I would like to modify it so that it only appears on the main page of my site. What do I need to change/add? Thanks! Code: <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript"> $(document).ready(function(){ //Page Flip on hover $("#pageflip").hover(function() { $("#pageflip img , .msg_block").stop() .animate({ width: '506px', height: '517px' }, 500); } , function() { $("#pageflip img").stop() .animate({ width: '70px', height: '72px' }, 220); $(".msg_block").stop() .animate({ width: '70px', height: '70px' }, 200); }); }); </script> <div id="pageflip"> <a href="http://pagepeeler.ning.com/page/page/list"><img src="http://i187.photobucket.com/albums/x172/billvasko/pagepeel.png" alt="" /> <span class="msg_block">Page Peeler</span> </a> </div> CSS: . #pageflip { position: relative; } #pageflip img { width: 70px; height: 72px; z-index: 99; position: absolute; right: 0; top: 0; -ms-interpolation-mode: bicubic; } #pageflip .msg_block { width: 70px; height: 70px; position: absolute; z-index: 50; right: 0; top: 0; background: url(http://img18.imageshack.us/img18/2572/pagepeel.jpg) no-repeat right top; text-indent: -9999px; Hi there i have been looking around the internet for a way to resolve the problem i have, admittedly i may well of read the answer several times but being relatively new to JavaScript i am still unclear on much of the terminology. Well basically my problem is that i have a piece of code which wen tested on my mac i was using Firefox, safari, opera etc. all these worked fine when it came to pc testing with internet explorer i was presented with the following errors..... Error Details: 1) Line:32 Char:16 Error: 'getElementsByTagName(...).0.src' is null or not an object Code:0 URL:http://www.janedelacey.co.uk/html/press.html 2) Line:53 Char:41 Error: Object doesnt support this property or method Code:0 URL:http://www.janedelacey.co.uk/html/press.html The url is a clients webpage i dont think this has any effect on the issue. Here is the code for the page if this helps anyone in helping me resolve the issue! Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <LINK REL="SHORTCUT ICON" HREF="../images/favicon.ico"> <link rel="stylesheet" type="text/css" href="../css/layout.css"> <title> Jane De-Lacey - Press </title> <link rel="shortcut icon" href="favicon.ico" > <meta name="description" content="Jane De Lacey is a freelance lingerie designer and manufacturer using the finest silk to create Bras, Briefs, Camisoles, Slip, Dresses and Sleepmasks. The latest collection is called the 'L.A Collection'. "> <meta name="keywords" content="Jane De Lacey, Jane DeLacey, Lingerie, 100% Silk, Bra, Knickers, Briefs, Slips, Camisoles, Dresses, Sleepmasks, Underwear, Sheer Silk, Chemise"> <!--[if lt IE 8]> <style media="screen,projection" type="text/css"> #jgal1 li { filter: alpha(opacity=40); } #jgal1 li.active, #jgal1 li:hover { filter: alpha(opacity=100); } </style> <![endif]--> <script type="text/javascript">document.write("<style type='text/css'> #press_gallery { display: none; } </style>");</script> <!--[if lt IE 6]><style media="screen,projection" type="text/css">#press_gallery { display: block; }</style><![endif]--> <script type="text/javascript"> var gal1 = { init : function() { if (!document.getElementById || !document.createElement || !document.appendChild) return false; if (document.getElementById('press_gallery')) document.getElementById('press_gallery').id = 'jgal1'; var li = document.getElementById('jgal1').getElementsByTagName('li'); li[0].className = 'active'; for (i=0; i<li.length; i++) { var url = li[i].getElementsByTagName('img')[0].src; var url_array = url.split("/"); var j = url_array.length - 1; var thumb_path = "../images/thumbs/"; li[i].style.backgroundImage = 'url(' + thumb_path + url_array[j] + ')'; li[i].style.backgroundRepeat = 'no-repeat'; li[i].title = li[i].getElementsByTagName('img')[0].alt; gal1.addEvent(li[i],'click',function() { var im = document.getElementById('jgal1').getElementsByTagName('li'); for (j=0; j<im.length; j++) { im[j].className = ''; } this.className = 'active'; }); } }, addEvent : function(obj, type, fn) { if (obj.addEventListener) { obj.addEventListener(type, fn, false); } else if (obj.attachEvent) { obj["e"+type+fn] = fn; obj[type+fn] = function() { obj["e"+type+fn]( window.event ); } obj.attachEvent("on"+type, obj[type+fn]); } } } gal1.addEvent(window,'load', function() { gal1.init(); }); </script> </head> <body> <div id="content"> <div id="navcontainer"> <div id="topbanner"> <a href="home.html"><img src="../images/logo1.gif" border="none" width="380" height="50"alt="Home - Jane DeLacey"/></a> </div> <ul id="nav"> <li id="nav-home"><a href="home.html">Home</a></li> <li id="nav-shop"><a href="shop.html">Collections</a></li> <li id="nav-press"><a href="press.html">Press</a></li> <li id="nav-about"><a href="about.html">About Us</a></li> <li id="nav-contact"><a href="contact.html">Contact Us</a></li> </ul> </div> <div id="product"> <div id="product_graf"> <img src="../images/top_lines.gif" alt="Side Graphic" height="300px"> </div> <div id="press"> <div id="press_text"> click logo to view image, click image to enlarge </div> <div id="press_pics"> <ul id="press_gallery"> <li><a href="../images/press/marieclaire.jpg"><img src="../images/press/marieclaire.jpg"width="475px" height="500px" alt="Marie Claire featuring Victoria Beckham" border="none" ></a></li> <li><a href="../images/press/vogue1.jpg"<img src="../images/press/vogue1.jpg"width="350px" height="500px" alt="Vogue" border="none"></a></li> <li><a href="../images/press/elle1.jpg"<img src="../images/press/elle1.jpg"width="350px" height="500px" alt="ELLE" border="none" ></a></li> <li><a href="../images/press/wwd1.jpg"<img src="../images/press/wwd1.jpg"width="350px" height="500px" alt="Womens Wear Daily" border="none" ></a></li> <li><a href="../images/press/brides.jpg"<img src="../images/press/brides.jpg" width="350px" height="500px"alt="Brides" border="none" ></a></li> <li><a href="../images/press/wwd2.jpg"<img src="../images/press/wwd2.jpg" width="350px" height="500px"alt="ELLE" border="none" ></a></li> <li><a href="../images/press/elle2.jpg"<img src="../images/press/elle2.jpg" width="350px" height="500px"alt="ELLE" border="none" ></a></li> <li><a href="../images/press/hg.jpg"<img src="../images/press/hg.jpg" width="350px" height="500px"alt="Homes and Gardens" border="none" ></a></li> <li><a href="../images/press/vogue2.jpg"<img src="../images/press/vogue2.jpg" width="350px" height="500px"alt="Vogue" border="none" ></a></li> <li><a href="../images/press/wwd3.jpg"<img src="../images/press/wwd3.jpg" width="350px" height="500px"alt="Womens Wear Daily" border="none" ></a></li> <li><a href="../images/press/elle3.jpg"<img src="../images/press/elle3.jpg" width="350px" height="500px"alt="ELLE" border="none" ></a></li> <li><a href="../images/press/status1.jpg"<img src="../images/press/status1.jpg" width="350px" height="500px"alt="Status" border="none" ></a></li> <li><a href="../images/press/elle4.jpg"<img src="../images/press/elle4.jpg"width="500px" height="350px" alt="ELLE" border="none" ></a></li> <li><a href="../images/press/wwd4.jpg"<img src="../images/press/wwd4.jpg"width="350px" height="500px" alt="Womens Wear Daily" border="none" ></a></li> <li><a href="../images/press/status2.jpg"<img src="../images/press/status2.jpg" width="350px" height="500px"alt="Status" border="none" ></a></li> <li><a href="../images/press/fashiondaily.jpg"<img src="../images/press/fashiondaily.jpg" width="500px" height="350px"alt="Fashion Daily" border="none" ></a></li> <li><a href="../images/press/eve.jpg"<img src="../images/press/eve.jpg" width="350px" height="500px"alt="Eve" border="none" ></a></li> <li><a href="../images/press/observer.jpg"<img src="../images/press/observer.jpg" width="350px" height="500px"alt="Observer Magazine" border="none" ></a></li> <li><a href="../images/press/telegraph.jpg"<img src="../images/press/telegraph.jpg" width="350px" height="500px"alt="Telegraph" border="none" ></a></li> <li><a href="../images/press/financialtimes.jpg"<img src="../images/press/financialtimes.jpg" width="350px" height="500px"alt="Financial Times" border="none" ></a></li> <li><a href="../images/press/linbuyer.jpg"<img src="../images/press/linbuyer.jpg" width="350px" height="500px"alt="Lingerie Buyer Blog" border="none" ></a></li> <li><a href="../images/press/juice1.jpg"<img src="../images/press/juice1.jpg" width="350px" height="500px"alt="Juice Brighton Magazine" border="none" ></a></li> <li><a href="../images/press/ideal.jpg"<img src="../images/press/ideal.jpg" width="350px" height="500px"alt="Ideal" border="none" ></a></li> <li><a href="../images/press/drapers.jpg"<img src="../images/press/drapers.jpg" width="500px" height="200px"alt="Drapers" border="none" ></a></li> <li><a href="../images/press/juice2.jpg"<img src="../images/press/juice2.jpg" width="500px" height="350px"alt="Juice Brighton Magazine" border="none" ></a></li> </ul> </div> <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/> </div> <div id="footer"> <ul id="footer_nav"> <li><a href="terms.html">terms & conditions</a></li> <li><a href="delivery.html">delivery</a></li> <li><a href="acknowledge.html">acknowledgments</a></li> <li><a href="contact.html">contact us</a></li> </ul> </div> </div> </div> </body> </html> I know most of this code will not be relevant but i thought adding the whole pages code made more sense? Thank you in advance for any help received! Tom Hello, I'm new to Javascript programming. I have designed a Javascript to carry information from one page to another. It works fine in firefox but does not work in internet explorer. Is there some coding that needs to be specified for my script to work in ie? Thanks I have the following Javascript function that just refuses to work in Internet Explorer (since IE is absolute .......). Can anybody tell me why this wouldn't be working in IE and what I need to do to fix it? I am new to Javascript so don't really have any idea Code: function displaymember() { var d = new Date(); var curr_date = d.getDate(); if (curr_date < 10) curr_date = "0" + curr_date; var curr_month = d.getMonth(); curr_month++; if (curr_month < 10) curr_month = "0" + curr_month; var curr_year = d.getFullYear(); //alert("date="+curr_date+" month="+curr_month+" year="+curr_year); for (i = 0; i < x.length; i++) { membershipstatus = (x[i].getElementsByTagName("membership_status")[0].childNodes[0].nodeValue); name = (x[i].getElementsByTagName("name")[0].childNodes[0].nodeValue); body = (x[i].getElementsByTagName("body_type")[0].childNodes[0].nodeValue); ethnicity = (x[i].getElementsByTagName("ethnicity")[0].childNodes[0].nodeValue); sex = (x[i].getElementsByTagName("sex")[0].childNodes[0].nodeValue); profession = (x[i].getElementsByTagName("profession")[0].childNodes[0].nodeValue); seeking = (x[i].getElementsByTagName("seeking")[0].childNodes[0].nodeValue); date = (x[i].getElementsByTagName("date_joined")[0]); month = (date.getElementsByTagName("month")[0].childNodes[0].nodeValue); year = (date.getElementsByTagName("year")[0].childNodes[0].nodeValue); newa = document.createElement('a'); aIdName = 'my' + i + 'a'; ahref = '#'; aclick = 'show(' + i + ')'; newa.setAttribute('id', aIdName); newa.setAttribute('href', ahref); newa.setAttribute('onclick', aclick); newa.innerHTML = name + " | " + body + " " + ethnicity + " " + sex + " " + profession + " with " + membershipstatus + " membership seeks " + seeking + "<br/>"; if (curr_month == month && curr_year == year) { document.getElementById("member").appendChild(newa); } } } Hi, i have recently just built a simple website and have started to add some added editions one being the lightbox. i am using dreamweaver cs3 and on a mac laptop, so in safari it works brillaint no problems what so ever. but as soon as you load it in internet explorer the light box opens but it displays a 404 error on the first image of every gallery, on every different profile? if anyone would help that would be fantastic http://www.goodeveningladies.co.uk/profiles.co.uk Code: <a href="../images/lrgimages/adam/AdamLrg.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]"> <img src="../images/Adam.jpg" alt="" width="450" height="200" align="middle" /> <a href="../images/lrgimages/adam/1.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]"> <a href="../images/lrgimages/adam/2.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]"> <a href="../images/lrgimages/adam/3.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]"> <a href="../images/lrgimages/adam/4.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]"> <a href="../images/lrgimages/adam/5.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]"> <a href="../images/lrgimages/AdamLrg.jpg" title="Call us today on 07792530515!" rel="sexylightbox[Goodeveningladies.co.uk - Adam]"></a> here is a section of the coding that i use for each image obviously the names have changed and the directories have changed for each profile. any help would be much appreciated. Hi I normally use Firefox as my web browser. After adding the comment script to my site I have now found out that the script isn't working with Explorer 8. Clicking on the 'Send Comment' button when using Explorer 8 doesn't work, yet it works fine with Firefox. Hopefully then there can't be too much wrong. You can see the script and test it he http://creatingwebsites-4u.co.uk/com...st/example.php Regards Mark Hi All, This is my first post in this forum. I am relatively new to javascript. Hope I get some guidance here. Also I would like to contribute here when I get little expertise on javascript. I have developed following snippet of code, which is working very well with firefox 6.0. But when it comes to IE 8.0, it just does not work. Quote: <SCRIPT LANGUAGE="JavaScript"> function refreshFrame() { frames['top'].window.location.href = "report.php?parent_id=<? echo $parent_id; ?>"; } </script> </head> <? include('style.php'); include('PHP_functions.php'); print(" <FRAMESET rows='96,100' onLoad=refreshFrame() BORDERCOLOR=blue BORDER=0> <FRAME SRC=blank.html SCROLLING=NO NORESIZE NAME=top> <FRAME SRC=manage.php?view=show_all&parent_id=$parent_id NAME=bottom> </FRAMESET> "); ?> </HTML> In the above script, I am trying to load the frame top after loading frame bottom, as the latter takes more time to load due to some processing involved. Till frame bottom is under processing stage, I display a message "Processing Please wait" which is coming from blank.html. Working under Firefox: It loads blank.html first and displays the message as "processing please wait". Once frame bottom has completed the processing it displays its contents at second half of the webpage. Then finally frame top gets loaded on first half of the web page. This is the expected result. Here URL does not change as the URL remains same as before "http://xyz.com/index.html" Not Working under IE It loads blank.html first and displays the message as "processing please wait". Once frame bottom has completed the processing it displays its contents at second half of the webpage. Then finally frame top gets loaded on whole page instead of first half of the page. Here URL changes to complete new URL as "http://xyz.com/report.php?parent_id" Can anyone please suggest what could be reason for this. Thanks, Vinay i'm having a problem getting something called JavaScript Bitcoin Miner working in IE6+ the error i'm getting is: Line: 8 Char: 6 Error: 'JSON' is undefined Code: 0 URL: http://192.168.0.105/Bitcoin_Miner/index.html does anyone know how i can get this working? thanks. Attached is the source files. BTW... you'll need to instal XAMPP to get this working correctly on your local PC. But if there's a way all of the PHP can be converted to PHP, and Jquery can be cut out of the picture, it would be VERY helpful Hi All, I have a javascript function which adds a label and value to a select widget in its parent window. The function is working fine in firefox and chrome without any errors or warnings. But it is not working in internet explorer. Please tell me what the issue is. Thanks in advance for your help. Code: function addToParent( formName, selectName, name, label ) { var parent = window.opener; var selectWidget = parent.document.forms[formName].elements[selectName]; if( selectWidget ) { var length = selectWidget.length; selectWidget[length] = new Option( name, label, false, false ); } } When I tried to debug, internet explorer shows an error in the following line Code: selectWidget[length] = new Option( name, label, false, false ); Is there anything wrong with this statement ?? It works in Google Chrome but not Firefox and Internet Explorer. My computer has blocked Opera and I don't know how to change that. Too much energy to investigate now, I'll do so later. Are there any pros that can tell me why this is happening? I'm assuming GoogleChrome is fixing a syntax error that FF and IE don't. Code: var request; request=false; try { request = new XMLHttpRequest(); } catch (trymicrosoft) { try { request = new ActiveXObject("Msxml2.XMLHTTP"); } catch (othermicrosoft) { try { request = new ActiveXObject("Microsoft.XMLHTTP"); } catch (failed) { request = false; } } } function isAlNum(str){ return /^[a-z0-9]+$/i.test(str); } var preUsername; var same; function updatePage() { if (username.value.length>0){ if ( request.responseText.indexOf("0") == -1 ) {userNameErrorBox.innerHTML=username.value + " has already been taken"; usernameSuccessBox.innerHTML="";} else {userNameErrorBox.innerHTML=""; usernameSuccessBox.innerHTML=username.value + " is available";}} } function nameTest() { if (username.value==preUsername) {same=1;} else {same=0;} if (!isAlNum(username.value)) {if (username.value.length>0) {username.value=preUsername;}} else {preUsername=username.value;} if (username.value.length>0 && username.focus && same===0) { userNameErrorBox.innerHTML="";usernameSuccessBox.innerHTML=""; request.abort(); var url = "/unseen/checkIfUserNameExist.php?name=" + username.value; request.open("GET", url, true); request.onreadystatechange = updatePage; request.send(null); } if (username.value.length===0) { userNameErrorBox.innerHTML="";usernameSuccessBox.innerHTML="";preUsername=""; } } I back tracked what i did and it appears that this code Code: var url = "/unseen/checkIfUserNameExist.php?name=" + username.value; request.open("GET", url, true); request.onreadystatechange = updatePage; request.send(null); has the problem. When I set up alerts to see what works and what doesn't, this code seems to be causing the FF and IE to not work, but I can't tell what it is that's causing them to fail. This is javascript that is suppose to check if a name has been taken by another user. I'm working on a fairly large project that I wish to be the new formspring, (size wise) I procrastinated for 2 weeks of my 12 week break and now that I'm just getting started on it I'm running into an ishness load of problems... Very de-motivating Hi, I have dozens of pages on my website which have just started showing an 'Error on page' message at the bottom left of Internet Explorer 8.0. These messages do not appear when using Mozilla Firefox. My website is www.lakesandcumbria.com and an example of a page showing the error message is http://www.lakesandcumbria.com/view/walks/ambleside.htm which contains a javascript drop down list. All other pages using this type of drop down list are showing the same error message (dozens of them). I have ensured that 'Script debugging' is disabled in Internet Explorer but this hasn't helped! Help - How can I stop this happening in Internet Explorer 8.0 please? 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 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 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 The 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} */ 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 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. 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 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. 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! |