Show / Hide Elements Using JavaScript
Topics
Hi, I'll explain my situation: I'm completely new to javascript so what i want to do is make a script that shows a specific div when the visitor is at the homepage but hide it when hes in another page of my website. i've read some people trying to explain it to someone else but it seems that i need to learn many aspects of the javascript language to edit it to my needs. I'm a med student and im really tight in my schedule and have almost no extra time to sit and read about javascript just so i can do this one specific thing. Would you please help me out? I've been trying to figure this out on my own for the past 3 days with no success. I will greatly appreciate it if someone helps me. PLEASE... Hello everyone, I am trying to figure a solution to this CSS/JavaScript navigation menu. I have a couple of different classes set out for each level of the menu, which there are 4 levels max. The first level has a class for it called 'pMenuMain'. The second and third have names 'pMenu2' and 'pMenu3'. The 4th level is found by its <a> tags, because all of those are links. This is the JavaScript I need to change somehow: Code: <script src="http://code.jquery.com/jquery-1.6.1.min.js" type="text/javascript"></script> <script type="text/javascript"> var timeout = 1000; var closetimer = 0; var ddmenuitem = 0; function jsddm_open() { jsddm_canceltimer(); jsddm_close(); ddmenuitem = $(this).find('ul').css('visibility', 'visible');} function jsddm_close() { if(ddmenuitem) ddmenuitem.css('visibility', 'hidden');} function jsddm_timer() { closetimer = window.setTimeout(jsddm_close, timeout);} function jsddm_canceltimer() { if(closetimer) { window.clearTimeout(closetimer); closetimer = null;}} $(document).ready(function() { $('.pMenu2').hover(jsddm_open, jsddm_timer) $('.pMenu > li > ul').hover(jsddm_open, jsddm_timer)}); document.onclick = jsddm_close; </script> Now this is the CSS style sheet: Code: /********************/ /*PERSONAL NAV MENU**/ /********************/ .pWrapper { padding-bottom:53%; padding-left:21%; } .pMenu { margin:0; padding:0; list-style:none; } /*IE 6 & 7 need inline block feature*/ ul.pMenu ul li{ width:100%; display:inline-block; } ul.pMenu ul ul li{ width:100%; display:inline-block; } ul.pMenu ul ul ul li{ width:100%; display:inline-block; } /*begin main list attributes*/ ul.pMenu > li:hover{ background:#F00; border:.33em ridge #C90; color:#FF0; } ul.pMenu > li{ float:left; list-style:none; margin-right:1%; display:block; color:#FFF; background:#900; border:.33em ridge #C30; text-decoration:none; } .pMenuMain{ text-shadow:1px 1px 1px #000; white-space:nowrap; padding-top:.7em; padding-bottom:.7em; text-align:center; } /*first sub-list*/ ul.pMenu li li{ margin-right:0; } ul.pMenu ul { margin:0; padding:0; position:absolute; visibility:hidden; } .pMenu2{ background:#CCC; border:.25em outset #999; width:10em; font-size:12px; padding-top:.5em; padding-bottom:.5em; padding-right:2em; padding-left:.5em; text-decoration:none; text-shadow:1px 1px 1px #000; color:#000; position:relative; text-align:left; top:.33em; visibility:hidden; } .pMenu2:hover{ background:#999; border:.25em inset #666; text-decoration:blink; } /*second sub-list*/ ul.pMenu ul ul{ margin:0; padding:0; position:absolute; visibility:hidden; display:none; } .pMenu3{ background:#999; border:.25em outset #666; width:13em; font-size:11px; padding-top:.35em; padding-bottom:.35em; padding-right:2em; padding-left:.5em; text-decoration:none; text-shadow:1px 1px 1px #000; color:#000; position:relative; text-align:left; top:.33em; visibility:hidden; } ul.pMenu ul ul li { float:none; display:inline; } ul.pMenu ul ul li a { width:auto; background:#999; border:.15em outset #666; text-shadow:1px 1px 1px #000; color:#FFF; } ul.pMenu ul ul a:hover { background:#999; border:.15em inset #666; text-decoration:blink; } /*third sub-list*/ ul.pMenu ul ul ul { margin:0; padding:0; position:absolute; visibility:hidden; } ul.pMenu ul ul ul li { float:none; display:inline; } ul.pMenu ul ul li a { width:auto; background:#999; border:1% outset #666; text-shadow:1px 1px 1px #000; color:#FFF; } ul.pMenu ul ul li a:hover { background:#999; border:1% inset #666; text-decoration:blink; } /******************/ /*End Personal Nav*/ /*****************/ This is how it's set up in HTML: Code: <!-- begin Personal navigation menu --> <div class="pWrapper"> <ul class="pMenu"> <li style="width:10%;"><div class="pMenuMain">health</div> <ul style="left:18em;"> <li><div class="pMenu2">weight loss</div> <ul> <li><div class="pMenu3">fitness</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> <li><div class="pMenu3">dieting</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> </ul> </li> <li><div class="pMenu2">skin care</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> </ul> </li> </ul> <ul class="pMenu"> <li style="width:14%;"><div class="pMenuMain">insurance</div> <ul> <li><div class="pMenu2">property insurance</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> <li><div class="pMenu2">auto insurance</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> <li><div class="pMenu2">health insurance</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> <li><div class="pMenu2">annuities</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> </ul> </li> </ul> <ul class="pMenu"> <li style="width:11.3%;"><div class="pMenuMain">general</div> <ul> <li><div class="pMenu2">electronics</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> <li><div class="pMenu2">style & fashion</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> <li><div class="pMenu2">food/dining</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> <li><div class="pMenu2">cars/auto</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> </ul> </li> </ul> <ul class="pMenu"> <li style="width:10%;"><div class="pMenuMain">dating</div> <ul> <li><a href="#">RealMatureSingles</a></li> <li><a href="#">SeniorPeopleMeet</a></li> </ul> </li> </ul> <ul class="pMenu"> <li style="width:13.8%;"><div class="pMenuMain">education</div> <ul> <li><div class="pMenu2"><a href="#">under construction</a></div></li> </ul> </li> </ul> </div> <!-- end Personal navigation menu--> I know that I will receive critique for the HTML I created for this. The reason I am going this route is that a drop down menu with a list full of <a href="#"> can be clicked, resetting the menu. This is a flaw in functionality. Hi everyone, was wondering if someone would be able to help me out, and correct this, or suggest an alternative. I have hidden divs, and I have achieved easily and simply this with the following, but on click I want the other divs to hide so that they all can't be displayed at once, at the moment they just stack up on top of each other. I'm trying to keep it as simple as possible as i'm much the novice Code: <script> function showhide(id){ if (document.getElementById){ obj = document.getElementById(id); if (obj.style.display == "none"){ obj.style.display = ""; } else { obj.style.display = "none"; } } } } </script> and then <a href="#" onclick="showhide('divname'); return(false);"> Thanks in advance Hello i use a javascript to use drop down lists so i display the appropriate products to user. Atm no matter the user option i display 3 drop down lists in whole products. Lets say the drop down lists are like manufacturer/order by/sochet. When the user wish to see "processors" then the sochet list have values, but when he choose "printers" the sochet list is empty since the printers dont contan sochets. In this case i want to hide the sochet drop down list in order to be more familiar to the user is that possible? My js looks like this Code: <script type="text/javascript"> function showUser() { var q=document.getElementById("manuf"); var q_val = q.options[q.selectedIndex].value; var t=document.getElementById("soch"); var t_val = t.options[t.selectedIndex].value; var c=document.getElementById("order"); var c_val = c.options[c.selectedIndex].value; if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { var q=document.getElementById("manuf"); var q_val = q.options[q.selectedIndex].value; var t=document.getElementById("soch"); var t_val = t.options[t.selectedIndex].value; var c=document.getElementById("order"); var c_val = c.options[c.selectedIndex].value; if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("txtHint").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","productsdata.php?q=" + q_val + "&t=" + t_val+"&c=" +c_val, true); xmlhttp.send(); } </script> and my drop down lists like PHP Code: <select name="products2" id="soch" onchange="showUser()"> <option value="" selected="selected">Sochet</option> <?php do { ?> <option value="<?php echo $row_sochet['sochet']?>"><?php echo $row_sochet['sochet']?></option> <?php } while ($row_sochet = mysql_fetch_assoc($sochet)); $rows = mysql_num_rows($sochet); if($rows > 0) { mysql_data_seek($sochet, 0); $row_sochet = mysql_fetch_assoc($sochet); } ?> </select> http://dannycremers.com/menus.html i've been experimenting with random images floating in the background that i now want to turn into links to other images, the code i have right now is the following: Code: <div id="div2"><a href="#sub_target" onclick="return togg_sibl(this)"><img src="http://dannycremers.com/img/2.png" alt="" /></a> <div><a href="#" onclick="return togg_sibl(this)"><img src="http://dannycremers.com/inprogress/img/koekoek.jpg" alt="" /></a></div></div> image 2.png is the image with the black border, onclick of that image i want the orange picture to become visible in the center of the page which sort of works.. but for some reason when the page loads an extra version of the orange image shows up as well, any idea how i can get rid of this while also maintaining the orange image showing up onclick?? another issue i've been having is with the fadein code, it always used to work but after adding the onclick/toggle script it stopped working, does anybody have any idea why that is and how i can work around that? tnxxx! I'm creating a website where I would like to create some kind of tabbed pages. To do that I wrote a javascript where I create an array of all the divs I use to create the pages and then sets them all on style="display: none;" except the one I clicked which should get style="display: block;" But I can't seem to get it to work... This is the script itself: Code: var state = 'none'; var i; var divs = new Array(); divs[0] = document.getElementById(div1); divs[1] = document.getElementById(div2); divs[2] = document.getElementById(div3); divs[3] = document.getElementById(div4); divs[4] = document.getElementById(div5); function showhide(layer_ref) { divs[0].innerHTML="some contents"; for (i=0;i<divs.length;i++) { if(divs[i] == document.getElementById(layer_ref)) { state = 'block'; } else { state = 'none'; } if (document.all) { //IS IE 4 or 5 (or 6 beta) eval( "document.all." + divs[i] + ".style.display = state"); } if (document.layers) { //IS NETSCAPE 4 or below document.layers[divs[i]].display = state; } if (document.getElementById &&!document.all) { hza = document.getElementById(divs[i]); hza.style.display = state; } } } And this is part of the html of the page: Code: <head> <script type="text/javascript" src="scriptShowHide.js"></script> </head> <div id="navigation"> <ul class="tabContainer2"> <li><a class="orange" href="#" onclick="showhide('div1');">Tab1</a></li> <li><a class="orange" href="#" onclick="showhide('div2');">Tab2</a></li> <li><a class="orange" href="#" onclick="showhide('div3');">Tab3</a></li> <li><a class="orange" href="#" onclick="showhide('div4');">Tab4</a></li> <li><a class="orange" href="#" onclick="showhide('div5');">Tab5</a></li> </ul> </div> <div id="div1" style="display: block;">This is the content of tab1</div> <div id="div2" style="display: none;">This is the content of tab2</div> <div id="div3" style="display: none;">This is the content of tab3</div> <div id="div4" style="display: none;">This is the content of tab4</div> <div id="div5" style="display: none;">This is the content of tab5</div> Can anyone help me plz, I've been staring at this for hours... I have an iFrame on which I wish to display scrollbars ONLY when the mouse is over the iFrame AND the source of the iFrame is larger than the iFrame can display I am using the following code for the iFrame but believe that I need to add some script to make it work: Code: <iframe src="http://www.mhgoebel.com" frameborder="0" id="frame" width="320" height="356" scrolling="no"> onmouseover="setScrolling('auto')" onmouseout="setScrolling('no')" </iframe> Hi, I need a button that not only resets what is typed in the textarea but also hides all shown tables... Here's how my current set up is... ---------text area------ with a reset button table1 title (when clicked, shows a table under it) table2 title (when clicked, shows a table under it) table3 title (when clicked, shows a table under it) the tables under the main tables have buttons that when clicked on inserts texts in the textarea. Any help would be much much appreciated! What I want to do, is that, when the user select one option out of many from the dropdown box some new fields appears. I was so close to make it , using this example: Code: <script type="text/javascript"> function showInfo() { var elem = document.getElementById('verify'); if(document.forms[0].menu.value == "verify"){ elem.style.display="inline";} else{ elem.style.display="none";} } </script> </head> <body> <form action="#" method="post"> <select name="menu" onchange="showInfo()"> <option value="none">Select an option</option> <option value="email">Email</option> <option value="verify">Verify</option> </select> <div id="verify" style="display:none;"> <input type="text" value="Username" > <input type="password" value="password" > </div> </form> But what I do want, is that two differen things appear on the page and in the different location of the page. And this script does not read the second <div>. So the result is, that the only first <div> appears. Here are some images of what I want to do. Befo http://img82.imageshack.us/img82/7093/beforens9.jpg After http://img246.imageshack.us/img246/2759/afterzh2.jpg (what has to be changed is on the red circules). So can someone help me with this script?? Please! I am pritty noob to the javascript. Hello forum, I need some help please. I need a javascript which hides X and shows Y if a button (text) is pressed. Needs to work on a webpage. Can someone help? hi i recently working on a project i need to create hard code first of list of element something like the below of code but i not sure if i declare this array correctly? var it = [{ "id": "1001", "type": "Regular" },{ "id": "1002", "type": "Chocolate" },{ "id": "1002", "type": "Blueberry" },{ "id": "1004", "type": "Devil's Food" }] secondly, i want to show all the data that have same id..so how should do ? must i for loop and if loop...cause i know need to if loop....is it meaning using continue statement i need to show in when i click on a link and those with the same id will display in the dialog can show any example PS...reply asap!!! thanks!!!!!! Hai.. I am using the popup :http://www.javascripttoolbox.com/lib...bined/popup.js The command for showing popup: Popup.show('contentDiv', 'targetDiv',"above left",{'constrainToScreen':true, 'autoHide':false}); Without 'autoHide' property i can use the command: Popup.hideAll(); for closing popup, But when i am using this 'autoHide' property, how can i close the popup?? Popup.hideAll(); is not working with me....... please help me.. I have a list with two items: Code: <select name="gateway" id="gateway"> <option value="2">PayPal</option> <option value="1">Credit/Debit Card</option> </select> When the second list item is selected, a div with several input fields needs to appear: Code: <div id="hidden_field"> Input fields are placed here. </div> Likewise, if someone selects the first list item, the div should not appear. Does anyone know how to do this with javascript? I am very new to javascript, so your help is greatly appreciated! Hi, I am doing some work, where I want to have a table heading that remains in a fixed position, when the window is scrolled (I will ultimately have a very long table). I have written the code below, which fixes the heading. I am trying to make it so that each body row of the table gets hidden, when the window is scrolled such that the row passes above the heading row. To do this I need to somehow detect the distance of each row from the top of the window as the window is scrolled so I can detect when it goes above the fixed heading row. I have tried to do this using offsetTop and scrollTop in the code below, but it doesn't seem to be working (in Safari at least, which I am using for my main testing). Does anyone know a simple way of detecting the distance to the top of the window so I can use it in my code below, which will work in all browsers? (I don't really want to use div, and overflow-y:auto to achieve the fixed heading scrollable table, because I don't want to have a sub-section with its own scrollbar. I just want to have the main page scrollbar when the list gets long enough to require it.) Thanks for your help. Cheers, Laudrup Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>test simple scroller</title> <style type="text/css"> .myvisible { visibility:visible; } .myinvisible { visibility:hidden; } table#mytable td { border-color: black; border-width: 1px 1px 1px 1px; border-style: solid; } table#mytable th { border-color: black; border-width: 1px 1px 1px 1px; border-style: solid; } table#mytable thead { position:fixed; top:50px; background:white; z-index:+1; } </style> <script language="JavaScript"> <!-- Beginning of JavaScript - var rows; function hideoverflow() { rows = document.getElementById("mytable").getElementsByTagName("tr"); for (i=1; i<rows.length; i++){ if((rows[i].ScrollTop - rows[i].offsetTop)>50){ rows[i].className="myinvisible"; } else{ rows[i].className="myvisible"; } } } // - End of JavaScript - --> </script> </head> <body onScroll='hideoverflow();'> <p>My heading</p><br> <table id="mytable" border="0" cellspacing="0"bordercolor="black"> <thead> <tr> <th width="100" bgcolor="white">HeadA</th> <th width="140" bgcolor="white">HeadB</th> <th width="120" bgcolor="white">HeadC</th> </tr> </thead> <tbody> <tr> <td width="100">row1</td> <td width="140">row1</td> <td width="120">row1</td> </tr> <tr> <td>row2</td> <td>row2</td> <td>row2</td> </tr> <tr> <td>row3</td> <td>row3</td> <td>row3</td> </tr> <tr> <td>row4</td> <td>row4</td> <td>row4</td> </tr> <tr> <td>row5</td> <td>row5</td> <td>row5</td> </tr> <tr> <td>row6</td> <td>row6</td> <td>row6</td> </tr> <tr> <td>row7</td> <td>row7</td> <td>row7</td> </tr> <tr> <td>row8</td> <td>row8</td> <td>row8</td> </tr> <tr> <td>row9</td> <td>row9</td> <td>row9</td> </tr> <tr> <td>row10</td> <td>row10</td> <td>row10</td> </tr> <tr> <td>row11</td> <td>row11</td> <td>row11</td> </tr> <tr> <td>row12</td> <td>row12</td> <td>row12</td> </tr> <tr> <td>row13</td> <td>row13</td> <td>row13</td> </tr> <tr> <td>row14</td> <td>row14</td> <td>row14</td> </tr> <tr> <td>row15</td> <td>row15</td> <td>row15</td> </tr> <tr> <td>row16</td> <td>row16</td> <td>row16</td> </tr> <tr> <td>row17</td> <td>row17</td> <td>row17</td> </tr> <tr> <td>row18</td> <td>row18</td> <td>row18</td> </tr> </tbody> </table> </body> </html> i've been using the show/hide function for this webpage http://dannycremers.com/HELP.html when you click on test 2 it works perfectly but when you click on test 3 there's an error and i don't know how to solve it as you can see 'test 3' pops up on the top of the list automatically.. and when i try to delete it.. the 'test 3' link that i want to keep disappears as well.. and ideas how to solve this easily? How can i make counter for my site that will alert how many visitors had been before every new Visiting? <script type="text/javascript" > function counter(incrimentbyone){ // IF i make var i=0 everytime alert will be 1 and like this alert is "NaN" var i=i+incrimentbyone; alert(i); } </script> <body onLoad="counter(1)"> Hi, my code below shows 2 radio buttons, when you click on one, it shows the content from a div, I would like to show the content of the checked radio button by default, at teh moment, they don't show any content until they are clicked! Code: <html> <head> <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("input[name$='group1']").click(function() { var test = $(this).val(); $("div.desc").hide(); $("#"+test).show(); }); }); </script> </head> <body> <input type="radio" name="group1" value="AvailableMon" checked>Available <input type="radio" name="group1" value="Unavailable">Unavailable <style type="text/css"> .desc { display: none; } </style> <div id="AvailableMon" class="desc">Available</div> <div id="Unavailable" class="desc">Unavailable</div> </body> </html> Hello, I need some help to insure that this: Code: <?php if ( is_404() || is_category() || is_day() || is_month() || is_year() || is_search() || is_paged() ) {?> <li> <?php /* If this is a 404 page */ if (is_404()) { ?> <?php /* If this is a category archive */ } elseif (is_category()) { ?> <?php /* If this is a yearly archive */ } elseif (is_day()) { ?> <?php /* If this is a monthly archive */ } elseif (is_month()) { ?> <?php /* If this is a yearly archive */ } elseif (is_year()) { ?> <?php } ?></li> <?php }?> </ul> <ul role="navigation"> <li><h2>Nyheder</h2><ul><?php wp_get_archives('type=monthly'); ?></ul></li> </ul> <ul><?php /* If this is the frontpage */ if ( is_home() || is_page() ) { ?> <li> <ul><?php wp_meta(); ?></ul> </li> <?php } ?> <?php endif; ?> </ul> Only appear on this page: http://finmand.dk/almastofa/nyheder-2 And if possible, how I can clean it up a bit, since there is stuff in there I don't think I need. I would like it to only be "Nyheder", under this there shall be (as now) a list of post, shown by which month they where made. Any help or advice would be helpful. Thanks I have a website at: http://www.zionism101.org/defaultfornow.aspx The page works on Google Chrome, Mozilla Firefox, and IE-9. It sort-of works on IE-8, however, the problem is that on IE-8, there is about 2 seconds where everything is shown on top of everything else in a mess. This is bad. The website is unusual in that it uses a menu to slide screens from right to left. This has implications. For instance, I need the menu to appear on all screens, so I use absolute positioning, and then use javascript to calculate the center position. The same goes for a logo image. And on top of that, some screens (which are really DIVs) have items positioned by absolute and relative positioning within them, and those positions are often calculated via javascript (and then set). On IE-8, the result is not good. I think what is happening is that the browser first shows everything as it appears before javascript is run, and then slowly the javascript is run, which puts everything in the correct position. So initially, not only is everything in the wrong position, but different DIVs appear on top of each other. I could tell every user to get IE-9 or chrome, but thats not a good solution. Thanks, Gid P.S. one solution might be to make the screen go black for an instant, until everything has settled down. If thats the only solution, how would I do that? P.P.S. there are actually 3 pages in the site: the login page, the logout page, and the founders page. Everytime the user switches between them, the jumble for 2 seconds occurs. I want some thing that when i click a button it shows a div then hides the button. I found this: Code: <script language="JavaScript"> function setVisibility(id, visibility) { document.getElementById(id).style.display = visibility; } </script> <input type=button name=type value='Show Layer' onclick="setVisibility('sub3', 'inline');";><input type=button name=type value='Hide Layer' onclick="setVisibility('sub3', 'none');";> <div id="sub3">Message Box</div> But it has two buttons that show and then hide the div, i only want one that shows the div then hides the button. Please help. Hi I'm new to this forum, and i need help with something, i think its easy to make but... i am making video blogging website and i need someone to make Hide or show menu, for example: When someone click on: Season 1 (it should show) Episode 1 Episode 2 Episode 3... (and when someone click on episode it should show text (usually <iframe... )) ty in advance and i can share 5$ on paypal if you make it right and easy to use, if I have it post in wrong category just transfer topic pls Best regards I have a background slide show from codelifter.com that normally runs in the body - I would like to use it as the background in a table cell. Thanks in advance for any help, Cyber-guys Here is the code: [CODE] <html> <head> <style> body{ background-repeat: no-repeat; background-position: 200 100;} </style> <script language="JavaScript"> <!-- // (C) 2006 CodeLifter.com var speed = 3000; var crossFadeDuration = 2; var Pic = new Array(); Pic[0] = 'slideshow1_1.jpg'; Pic[1] = 'slideshow1_2.jpg'; Pic[2] = 'slideshow1_3.jpg'; Pic[3] = 'slideshow1_4.jpg'; Pic[4] = 'slideshow1_5.jpg'; var t; var j = 0; var p = Pic.length; var preLoad = new Array(); for (i = 0; i < p; i++){ preLoad[i] = new Image(); preLoad[i].src = Pic[i];} function runSlideShow(){ if (document.all){ document.body.style.filter="blendTrans(duration=crossFadeDuration)"; document.body.filters.blendTrans.Apply(); document.body.filters.blendTrans.Play();} if (document.body){ document.body.background = Pic[j]; j = j + 1 if (j > (p-1)) j=0 t = setTimeout('runSlideShow()', speed)} } //--> </script> <title> CodeLifter.com :: Background Image Slideshow With Crossfade </title> </head> <body onload="runSlideShow()" bgcolor="#000000"> <table border="0" width="444" cellpadding="0" cellspacing="0"> <tr> <td> <font size="2" face="Verdana,Arial" color="#FFFFFF"> Lorem ipsum dolor situm amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer... </font> </td> </tr> </table> </body> </html> |