JavaScript - Help Creating Drawer Affect....
I am creating a website. I am working on the products page first. Please go here to see the site...
http://www.fingerguitar.com You see those social network icons under the product description div? When the mouse rolls over the right edge I want a drawer affect that pulls the icons into view and lets the user click one of the social links. When the user rolls his mouse away from the section, the drawer should return to its position. Any help... leads or anything would be awesome and much appreciated! Similar TutorialsHi guys, I have a form I am working on that has 4 text boxes in it, but I want to change it so that if a Radio button is selected it makes the 4th text box disappear, but still gives it a value of "0" when the form is submitted. Is this possible with Javascript? Here is what it looks like so far - Code: <FORM><table id='table_columns'> <tr> <td colspan="2" align="center">3 Columns <input name="3columns" type="radio" value="3columns"> 4 Columns <input name="4columns" type="radio" value="3columns"></td></tr><tr> <td align="right"><p>Column 1</p></td> <td align="left"><input class="txt" size="2" maxlength="2" name="WIDTH1" size="20" Title="Insert the desired width" value="25" /></td> </tr> <tr> <td align="right"><p>Column 2</p></td> <td align="left"><input class="txt" size="2" maxlength="2" name="WIDTH2" size="20" Title="Insert the desired width" value="25" /></td> </tr> <tr> <td align="right"><p>Column 3</p></td> <td align="left"><input class="txt" size="2" maxlength="2" name="WIDTH3" size="20" Title="Insert the desired width" value="25" /></td> </tr> <tr> <td align="right"><p>Column 4</p></td> <td align="left"><input class="txt" size="2" maxlength="2" name="WIDTH4" size="20" Title="Insert the desired width" value="25" /></td> </tr> </table> <br /> <input type="button" value="Save" Title="Save these Settings" onClick="updateSettings('COLUMNS');" /></FORM> If 3 Columns, WIDTH4 is not viewed and defaults to "0". If 4 Columns, all are visible and the number is then optional. Would love some assistance with this as my coding skills are pretty limited and my fingers have gone numb trying to google an answer. was wondering if it made sense to optimize the comparison order inside an if() statement if one of the comparison targets is a function call eg: Code: var a = true, b = function() {return false;}; if (b() || a) {...} if (a || b()) {...} would the second statement run faster because it would theoretically never need to call b() in this situation? can the eval order be relied on? does this depend on the js engine/internal optimizations? thanks, Leon i need to create a div as i click down and move while pressing the mouse button and the div will increase in size as i move the mouse while still pressing the mouse button. how can i accomplish this task Hi i am looking to create a js pop up to display an amazon widget which relates to an item on my page. so i've found this on the net http://blazonry.com/javascript/windows.php but im not very javascript minded and dont know where to start. so i have tried this Code: <img src="images/listen.png" border="0" alt="Preview Songs" title="Preview Songs" onclick="window.open("song_preview.php?id=<?php echo $row['ASIN']?>","Window1","menubar=no,width=430,height=360,toolbar=no");" /> but it loads a blank pop up at the same time the page loads up and not when an image is clicked? plus when i first loaded the page it said pop up blocked which sucks!! on the example i didnt get that, any reason why??? any help is appreciated thanks Luke I have asked to create a chatbox, which acts just like a messenger which I type a text in the textbox and press send to show output to the messagebox. However, in my code, I have 2 bugs which is bothering me. The first one is whenever I press spacebar, a "+" sign appear. The second is the first text disappeared whenever I type the second text. Please help me. Code: <html> <head> <title>Untitled</title> <script language="JavaScript" type="text/javascript"> <!-- var isShift=null; var isNN = (navigator.appName.indexOf("Netscape")!=-1); var OP = (navigator.appName.indexOf("Opera")!=-1); if(OP)isNN=true; var key; function shift(event){ key = (isNN) ? event.which : event.keyCode; if (key==16)isShift=1; } function process(event){ key = (isNN) ? event.which : event.keyCode; if(document.layers&&event.modifiers==4){ isShift=1; } if (key==13&&isShift!=1){ document.myForm.submit(); } if (key!=16)isShift=null; } function retrieve(){ document.myForm.text1.focus(); if(location.search.length>0){ blubb=unescape(location.search.split('=')[1]); document.myForm2.text2.value=blubb; } } //--> </script> </head> <body onload="retrieve()"> <form name="myForm"> <textarea name="text1" onkeypress="process(event)" onkeydown="shift(event)" cols="50" rows="7"></textarea><input type="submit" accesskey="s" value="Send"> </form><br><br> This second textarea is just to show, that the line breaks "arrive":<br> <form name="myForm2"> <textarea name="text2" cols="50" rows="7"></textarea> </form> </body> </html> Alright I have never really created a class before and I have to for a project. This is what I have so far and I will try to explain the requirements I am looking for thoroughly and what problems I am having. Code: <!doctype html public "-//w3c//dtd html 4.0 transitional//en"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <script language="javascript" type="text/javascript"> function clock () { //Object Constructor this.setT = function() { //Method Set Time //Properties this.currentTime = new Date ( ); this.currentHours = this.currentTime.getHours ( ); this.currentMinutes = this.currentTime.getMinutes ( ); this.currentSeconds = this.currentTime.getSeconds ( ); } clock.prototype.displayTime = function () { clock.setT } } </script> <body> <form name="form1"> <p> <input type="text" rows=7 cols=60 name="currentTime"> <br> <input type="button" value="Set Time" onClick="clock.displayTime();"> <br> <input type="button" value="Display Time" onClick="currentTime.value= completeTime;"> <br> <input type="reset" value="Reset"> </p> </form> </body> </html> The clock class contains: Three Properties: Hours Minutes, Seconds Two Methods setTime (which uses date class to get current time) Must be defined in the constructor displayTime (returns a string displaying current time) Must be defined as a prototype property of constructor The below is a very rough outline, and probably not correct. I've been reading up on objects for the last few hours and can't be very sure of anything yet. Code: function clock() { this.currentTime = new Date ( ); var currentHours = currentTime.getHours ( ); var currentMinutes = currentTime.getMinutes ( ); var currentSeconds = currentTime.getSeconds ( ); this.setTime = function() { } } clock.prototype.displayTime = function ( ) { } I guess my biggest problem now is the outline. Any help would be great hopefully once i get what goes where i can actually start writing the code. I already have the full code to write a basic clock just like this but it doesn't use classes or any of this. If anyone is planning on buying "ICAB4225B Automate Processes" in relation to a TAFE/College/School course, I suggest getting the teacher to actually READ the book before they use it. Tonight has been a HE-Double Hockeysticks (Not sure on language in this forum) of fixing mistakes the book has made. Double commars inplace of singles, singles inplace of doubles, single brackets, whole chunks of text that are wrong. In one place in the book it tells me to copy the text in blod and there is none. Anyway.... The code that the book has made me piece together over the last few questions has left me with: Code: <script type = "text/javascript"> { var counter = 0 var NoOfItems var ItemsNames = new Array() NoOfItems = prompt ("How many items do you want to hock?",""); for (NameCount=0; NameCount<NoOfItems; NameCount++) { ItemNames [NameCount] = prompt ("What are the names of your items?",""); } document.write ("<form name='myform'><br><table>"); while ( counter < NoOfItems) { document.write ("<tr><td><value>Enter the price of the " + ItemNames [count] + "</td><td><input type='text' name='" + ItemNames [count] + "'></td></tr>"); counter++ } document.write ("<tr><td><input type='submit' value='Submit Details' onClick='validateform'</td></tr></table></form>"); } </SCRIPT> The problem I am having it with the Array. I dont think that var = new Array is correct but thats what my text book is telling me. Any help? so now that i figured out how to add items in an array and i got the percent of each item from the total i have a table that looks something like this...(sorry the alignment is screwed up) Name Votes Percent 1.2.3.4.5.6.7.8.9.10..... Bob 45 14% Bill 86 26% George 122 37% Sam 79 24% the numbers One through Ten represent empty columns (i technically need 100 but i didnt write that out yet... so what i am trying to do is initially take the number i get from the percentage and fill in the amount of cells with a certain color.... so 14% would fill 14 of 100 cells..and this would create a bar graph..In theory I know how it should work I just can get any of the right syntax..here is the code i am working with... Code: var votes = new Array(); votes[0] = 45; votes[1] = 86; votes[2] = 122; votes[3] = 79; var ppl = new Array(); ppl[0] = "Bob"; ppl[1] = "Bill"; ppl[2] = "George"; ppl[3] = "Sam"; //var party = new Array(); //party[0] = "(D)"; //party[1] = "(R)"; //party[2] = "(I)"; //party[3] = "(G)"; function getPercent(){ var theSum = 0; for(var i = votes.length;i--;) { theSum += votes[i] } for(i=0;i<ppl.length;i++) { document.write("<tr><td>"+ppl[i]+"</td><td>"); document.write(votes[i]+"</td><td>"); var pct = document.write(Math.round(votes[i]/theSum*100)+"%"+"</td></tr>"); } //var total = document.write(numbers[numbers.length-1]); *property to get array length } function createBar(){ } thanks in advance for any help! Hi everyone, I want the source code of creating forum in JavaScript language.ASAP
hi i am new to javascript. i make a mcq quiz website in one of server side script. now for that website i want to make count down timer so when that quiz starts the user will have 5 minutes to complete that quiz if use does not able to complete quiz in given time then quiz should disable and shows the user score how can i achieve this I am writing a function that alerts a user that they did not enter a password what change do I need to make to this code to correct my issue it isn't doing anything [CODE] <script language = Javascript> function validate(){ if(document.login.pw.value==""); alert("Your id and or password is incorrect"); return false; } else return true; } </script> [CODE] So yeah, I'm making a science fair project, and need to know if someone could make the script below work into being invincible. Code: <Style Type="Text/CSS"> <!-- Input{} .blokje{ Height:48px; Width:48px; Font-Size:16pt; Font-Weight:900; Font-Family:Comic Sans MS,Arial,Verdana; Text-Align:Center; } .knopje{ Width:144px; } --> </Style> </HEAD> <!-- STEP TWO: Copy this code into the BODY of your HTML document --> <BODY> <!-- This script and many more are available free online at --> <!-- The JavaScript Source!! http://javascript.internet.com --> <!-- Original: Rob van der Ven (vennie@wanadoo.nl) --> <!-- Web Site: http://home.wanadoo.nl/vennie --> <Center> <Form> <Input Type="Button" Title="Click here to play again" Name="beurten" Width="164px" Class="knopje" Value="Player 1" onClick="wie = 'Player 1'; initieer()"> <Table CellPadding="0" CellSpacing="0" Border="0"> <Script Language="JavaScript"> <!--// for (i = 1; i < 10; i++) { if (i % 3 == 1) {document.write('<Tr>');} document.write('<Td><Input Type="Button" Name="' + i + '" Value=" " Class="blokje" onClick="wijzig(this.form,this)"></Td>'); if (i % 3 == 0) {document.write('</Tr>');} } //--> </Script> </Table> <Input Type="CheckBox" Title="Click here to change from 2 players or computergame" Name="automaat" Value="2 players" Id="autmat" onClick="if (this.value == 'Computer') {this.value = '2 players'; auto = 0} else {this.value = 'Computer'; auto = 1}; wie = 'Player 1'; initieer();"><Label For="autmat">against the computer</Label> <Table CellPadding="0" CellSpacing="0" Border="1"> <Tr BgColor="Silver"> <Td Align="Center"> Player 1 </Td> <Td Align="Center"> Player 2 </Td> <Td Align="Center"> Tie </Td> </Tr> <Tr BgColor="Silver"> <Td Align="Center"><Input Style="BackGround-Color:Transparent;Border:Solid 0px;Text-Align:Center" Type="Text" Size="3" ReadOnly Title="Player 1" Name="speler1" Value="0"></Td> <Td Align="Center"><Input Style="BackGround-Color:Transparent;Border:Solid 0px;Text-Align:Center" Type="Text" Size="3" ReadOnly Title="Player 2" Name="speler2" Value="0"></Td> <Td Align="Center"><Input Style="BackGround-Color:Transparent;Border:Solid 0px;Text-Align:Center" Type="Text" Size="3" ReadOnly Title="Tie" Name="Tie" Value="0"></Td> </Tr> </Table> </Form> </Center> <Script Language="JavaScript"> <!--// timerID = xtal = ytal = ztal = auto = 0; wie = 'Player 1'; function initieer(){ clearTimeout(timerID); cel = new Array(0,0,0,0,0,0,0,0,0,0); aanv = new Array(); strat = verd = leeg = aanv; beurt = wissel = 1; wint = keren = 0; document.forms[0].speler1.value = xtal; document.forms[0].speler2.value = ytal; document.forms[0].tie.value = ztal; if (wie != 'Start') { for (i in cel) { cel[i] = 0; if (i > 0) {document.forms[0].elements[i].value = ''}; } } document.forms[0].beurten.value = wie; } function zetten() { clearTimeout(timerID); if (aanv[0] > 0) { slag = aanv[Math.floor(Math.random() * 10) % aanv.length] } else if (verd[0] > 0) { slag = verd[Math.floor(Math.random() * 10) % verd.length]; } else if (strat[0] > 0) { slag = strat[Math.floor(Math.random() * 10) % strat.length]; } else { slag = leeg[Math.floor(Math.random() * 10) % leeg.length]; } if (beurt == 0 && slag > 0) {document.forms[0].elements[slag].click()}; } function win() { if ( cel[1] + cel[2] + cel[3] == 3 || cel[4] + cel[5] + cel[6] == 3 || cel[7] + cel[8] + cel[9] == 3 || cel[1] + cel[4] + cel[7] == 3 || cel[2] + cel[5] + cel[8] == 3 || cel[3] + cel[6] + cel[9] == 3 || cel[1] + cel[5] + cel[9] == 3 || cel[3] + cel[5] + cel[7] == 3 ) { if (confirm("Player 1: You win !!!\nDo you want to play again?")) { wint = 1; xtal++; wie = 'Player 1'; timerID = setTimeout('initieer()',800) } else { xtal++; wie = 'Start'; timerID = setTimeout('initieer()',800) }; } if ( cel[1] + cel[2] + cel[3] == 30 || cel[4] + cel[5] + cel[6] == 30 || cel[7] + cel[8] + cel[9] == 30 || cel[1] + cel[4] + cel[7] == 30 || cel[2] + cel[5] + cel[8] == 30 || cel[3] + cel[6] + cel[9] == 30 || cel[1] + cel[5] + cel[9] == 30 || cel[3] + cel[5] + cel[7] == 30 ) { if (confirm(((auto == 1) ? ('Computer wins, sorry') : ('Player 2: You win !!')) + "!\nDo you want to play again?")) { ytal++; wie = 'Player 1'; timerID = setTimeout('initieer()',800) } else { ytal++; wie = 'Start'; timerID = setTimeout('initieer()',800) }; } } function wisselen(beurt){ if (wissel == 1) { if (beurt == 0) { beurt = 1; wie = "Player " + 1 } else { if (auto == 0) {beurt = 0; wie = "Player " + 2} else {beurt = 0; wie = "Computer";} } if (keren == 9 ) { if (confirm("Tie!!!\n\nDo you want to play again?")) { ztal++; wie = 'Player 1'; timerID = setTimeout('initieer()',800)} else {ztal++; wie = 'Start'; timerID = setTimeout('initieer()',800)}; } } else { beurt = beurt; } wissel = 1; return(beurt); } function wijziging(klik) { plek = cel[klik]; geklikt = klik; if (plek == 0){ if (beurt == 0){ xo = "O"; plek = 10; } else { xo = "X"; plek = 1; } cel[klik] = plek; keren++; } else { if (plek == 10){ xo = "O";} if (plek == 1){ xo = "X";} wissel = 0 } return(xo); } function verdedig() {leeg = new Array(); verd = new Array(); for (i = 1; i < 10; i++) { oud = cel[i]; cel[i] = 1; if ( (cel[1] + cel[2] + cel[3] == 3 || cel[4] + cel[5] + cel[6] == 3 || cel[7] + cel[8] + cel[9] == 3 || cel[1] + cel[4] + cel[7] == 3 || cel[2] + cel[5] + cel[8] == 3 || cel[3] + cel[6] + cel[9] == 3 || cel[1] + cel[5] + cel[9] == 3 || cel[3] + cel[5] + cel[7] == 3) && oud == 0 ) { verd[verd.length] = i} cel[i] = oud; if (cel[i] == 0) { if (keren != 1) {leeg[leeg.length] = i} else if (cel[5] == 0) {leeg[0] = 5; leeg[1] = 10 - geklikt} else if (i % 2 != 0) {leeg[leeg.length] = i} }; } } function aanval() {aanv = new Array(); for (i = 1; i < 10; i++) { oud = cel[i]; cel[i] = 10; if ( (cel[1] + cel[2] + cel[3] == 30 || cel[4] + cel[5] + cel[6] == 30 || cel[7] + cel[8] + cel[9] == 30 || cel[1] + cel[4] + cel[7] == 30 || cel[2] + cel[5] + cel[8] == 30 || cel[3] + cel[6] + cel[9] == 30 || cel[1] + cel[5] + cel[9] == 30 || cel[3] + cel[5] + cel[7] == 30) && oud == 0 ) { aanv[aanv.length] = i} cel[i] = oud; } } function strategie() {strat = new Array(); for (i = 1; i < 10; i++) { oud = cel[i]; cel[i] = 10; if ( (cel[1] + cel[2] + cel[3] == 20 || cel[4] + cel[5] + cel[6] == 20 || cel[7] + cel[8] + cel[9] == 20 || cel[1] + cel[4] + cel[7] == 20 || cel[2] + cel[5] + cel[8] == 20 || cel[3] + cel[6] + cel[9] == 20 || cel[1] + cel[5] + cel[9] == 20 || cel[3] + cel[5] + cel[7] == 20) && oud == 0 ) { if (keren != 3) {strat[strat.length] = i} else if (i % 2 != 0) {strat[strat.length] = i} } cel[i] = oud; } } function wijzig(form,element){ wijziging(element.name); element.value = xo; beurt = wisselen(beurt); form.beurten.value = wie; verdedig(); aanval(); strategie(); win(); if (auto == 0 || wint == 1) {return} else { timerID = setTimeout('zetten()',600) } } initieer(); hi I am trying to create a textarea. There is a default text inside textarea. so when user clicks inside textarea then submit button appears and default text disappears and when user clicks somewhere else or outside textarea then it gets back to original state i.e, default text appears back and submit button disappears. here is what i did sofar. in this code when i click inside textarea then submit button does appear but text does not erase and when i click outside then button remains in sight. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style> #submit { visibility: hidden; } </style> </head> <body> <form> <label>Message:</label> <textarea name="message" id="message" rows="5" cols="30">write message here!</textarea><br /> <input type="button" name="submit" id="submit" value="submit" /> </form> </body> <script type="text/javascript" src="lib/jquery-1.4.min(Production).js"></script> <script> var flag = false; $(document).ready(function () { $('#message').click(function () { flag = true; $('#submit').css('visibility','visible'); if(flag == true) { //alert(flag); var msg = $('#message').val(); //alert(msg); msg = ""; //alert(msg); } }); }); </script> </html> Hello, The following web page is an essay, but there is JavaScript code in the head area: http://www.pinyinology.com/content/content3c.html You can see the 'Press F5 to reset' command, and please try it to see what happens. What I like is to create another command 'Click here to reset'. Therefore, there will be two commands for the reset task. Then it becomes: Click here or press F5 to reset. The press F5 stuff in the code is as follows; Code: //Typewriting code message='<span id="inTxt">wen<sup>2</sup></span>'; pos=0; maxlength=message.length+1; function writemsg() { if (pos<maxlength) { txt=message.substring(pos,0); document.getElementById('edit').innerHTML=txt; pos++; timer=setTimeout('writemsg()', 20); } } //Typewriting code2 own addition message2='<span id="inTxt2">wen<sup>2</sup>闻. ven<sup>2</sup>:文纹. win<sup>2</sup>:蚊. vin<sup>2</sup>:雯.'; pos=0; maxlength=message2.length+1; function writemsg2() { if (pos<maxlength) { txt=message2.substring(pos,0); document.getElementById('listing').innerHTML=txt; pos++; timer=setTimeout('writemsg2()', 20); } } Below is the complete code. It may help. Code: function KeyDown() { var key=window.event.keyCode; if (key==8) { window.event.returnValue=false; var r=document.selection.createRange(); r.collapse(false); r.move("character",-1); r.collapse(false); var p=r.parentElement(); if (p.nodeName.toLowerCase()=="sup"){ p.outerHTML=""; return; } window.event.returnValue=true; } } function KeyPress() { var key=window.event.keyCode; window.event.returnValue=false; if (key>=48 && key<=57) { var r=document.selection.createRange(); r.collapse(false); var d=r.duplicate(); d.moveStart("character",-1); var c=d.text; var p=d.parentElement(); var b=/[A-Za-z]/.test(c); //b=b || p.nodeName.toLowerCase()=="sup"; if (b) { d.collapse(false); var s=String.fromCharCode(key); s=(p.nodeName.toLowerCase()=="sup")? s:"<SUP>"+s+"</SUP>"; d.pasteHTML(s); d.collapse(false); d.select(); return; } } if (!(key in {37:1,38:1,39:1,40:1})) { var r=document.selection.createRange(); r.collapse(false); p=r.parentElement(); if (p.nodeName.toLowerCase()=="sup") { var s=p.outerHTML; p.removeNode(true); r.pasteHTML(s); r.collapse(false); r.select(); } } window.event.returnValue=true; } //Below for status line myMsg = " Happy Chinese typing !" var i = 0; function scrollMsg() { window.status = myMsg.substring(i,myMsg.length) + myMsg.substring(0,i); if (i < myMsg.length) { i++ } else { i = 0 } setTimeout("scrollMsg()",120) } function stoptimer() { clearTimeout(timer); } //Following function is for the appreciation window function newWindow() { catWindow = window.open('appr2.html', 'catwin','width=395,height=235, scrollbars=yes'); catWindow.focus(); } //Typewriting code message='<span id="inTxt">wen<sup>2</sup></span>'; pos=0; maxlength=message.length+1; function writemsg() { if (pos<maxlength) { txt=message.substring(pos,0); document.getElementById('edit').innerHTML=txt; pos++; timer=setTimeout('writemsg()', 20); } } //Typewriting code2 own addition message2='<span id="inTxt2">wen<sup>2</sup>闻. ven<sup>2</sup>:文纹. win<sup>2</sup>:蚊. vin<sup>2</sup>:雯.'; pos=0; maxlength=message2.length+1; function writemsg2() { if (pos<maxlength) { txt=message2.substring(pos,0); document.getElementById('listing').innerHTML=txt; pos++; timer=setTimeout('writemsg2()', 20); } } function stoptimer() { clearTimeout(timer); } Thanks in advance for your help. I have searched and scoured the web looking for a script like this. I have found different scripts that do certain aspects of what I am looking for, but not ONE that does it all. I am hoping you can help bring my search to an end! I need a script that when a user tries to leave a page, either by typing in a URL in the address bar or clicking an external link they get a Javascript (not pop up window) dialog box asking if they would like to complete a survey. If they click OK they are then redirected to the survey page. If they click cancel it allows them to go on their way to the external link. It needs to be able to decipher between internal and external links. The script needs to work with both IE and FF. This is a must. Safari would be a plus. I would like, BUT IS IN NO WAY A NECESSITY, for the script to also be cookie based in that the user doesn't see it if they've seen it within 7 or 14 days. I really hope you all can help me here as I am lost! If you need any other info from me please let me know! Hey All, I've currently working on making a calendar for my website. How do I go about creating a password for it? So that the admin can add events to it. Cheers Guys!!! Hi, my name is Joe. I have no expierience in writting scripts buy have managed to put together what I think is a decent website for a local business. It is a local Bait & Tackle shop. I have done this for free as I am retired and work a few days a week in the owners shop. This is my situation. I wish to display the current days high tides in a web page. I have created a database (csv file) which resides on my server This file has two fields: date and tidal times I am looking for a script that test the "date" field and if it is equal to the current date, display the tidal field. Any help would be appreciated. Thanks, Below is a javascript function from my website that loops through nodes in an XML file retrieving certain information about those who joined in the current month/year. The part in red creates a link which when clicked runs a function called show() with the relevant i variable value e.g. show(2) for the second node if that is relevant. Anyway the red part works in Chrome but not Internet Explorer (surprise surprise). I did some research which says that .setattribute is not allowed in IE. How can I change the red code to create links for the relevant records which works in IE? Thank you for your help Code: function displaymember() { var d = new Date(); var curr_month = d.getMonth(); curr_month++; if (curr_month < 10) curr_month = "0" + curr_month; var curr_year = d.getFullYear(); 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); 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 + " with " + membershipstatus + " membership seeks " + seeking + "<br/>"; if (curr_month == month && curr_year == year) { document.getElementById("member").appendChild(newa); } } } I would like to create a slideshow like what most wedding sites have but I would like to have some fancy transitions like "Random dissolve, checkerboard, spiral" e.t.c, how can I add any of those to my slideshow, this is a regular fade slideshow I have: Code: var speed=40; /* this is the image fade speed - higher value=slower, lower value=faster */ var timer=4000 /* this is the time that each image is static - 4000=4 seconds */ var pics=new Array(); pics[0]='images/autumn.jpg'; pics[1]='images/lace.jpg'; pics[2]='images/lotus1.jpg'; pics[3]='images/lotus.jpg'; pics[4]='images/apple.jpg'; pics[5]='images/apple4.jpg'; pics[6]='images/girl.jpg'; pics[7]='images/clouds.jpg'; pics[8]='images/blood.jpg'; pics[9]='images/buddha.jpg'; /****************** these links are optional and can be removed if not required ******************/ var links=new Array(); links[0]='http://www.google.com/'; links[1]='http://www.guardian.co.uk/crossword/'; links[2]='http://www.htmlforums.com/'; links[3]='http://www.w3schools.com/'; links[4]='http://www.alistapart.com/'; links[5]='http://news.bbc.co.uk/'; links[6]='http://validator.w3.org/'; links[7]='http://en.wikipedia.org/'; links[8]='http://tools.dynamicdrive.com/gradient/'; links[9]='http://www.hoogerbrugge.com/'; /*************************************************************************************************/ var topop=100; var botop=0; var topnum=0; var botnum=1; var test=0; function init() { objt=document.getElementById('top'); if(document.getElementById('link')) { objl=document.getElementById('link'); } else { objl=document.getElementById('container'); } bimg=document.createElement('img'); bimg.setAttribute('id','bot'); bimg.setAttribute('src',pics[1]); objl.appendChild(bimg); objb=document.getElementById('bot'); fader=setTimeout(function(){fadeout()},timer); } function fadeout() { if(document.getElementById('link')) { objl.href='#'; objl.style.cursor='default'; } test==0?(topop--,botop++):(topop++,botop--); if(objt.filters) { objt.style.filter='alpha(opacity='+topop+')'; objb.style.filter='alpha(opacity='+botop+')'; } else { objt.style.opacity=topop/100; objb.style.opacity=botop/100; } if(topop==0){ test=1; topnum+=2; if(topnum==pics.length+1) { topnum=1; } if(topnum==pics.length){ topnum=0; } objt.src=pics[topnum]; clearTimeout(fader); return stop(); } if(topop==100){ test=0; botnum+=2; if(botnum==pics.length) { botnum=0; } if(botnum==pics.length+1){ botnum=1; } objb.src=pics[botnum]; clearTimeout(fader); return stop(); } setTimeout(function(){fadeout()},speed); } function stop(){ if(document.getElementById('link')) { objl.style.cursor='pointer'; } if(test==0){ objl.href=links[topnum]; topop=100; botop=0; } if(test==1){ if(document.getElementById('link')) { objl.href=links[botnum]; } topop=1; botop=99; } setTimeout(function(){fadeout()},timer); } if(window.addEventListener){ window.addEventListener('load',init,false); } else { if(window.attachEvent){ window.attachEvent('onload',init); } } |