|
HTML - Html Or Java Slideshow
Hey, I'm helping design a site www.tbdgaming.com and we have an ad box up top that shows different pictures and captions for each one, and what we'd like to do is have those pictures (theres 5) switch every x seconds to the next one, and we'd like it to be clean. The code is:
Code: <!-- starting headlines -->
<div class="headlineWrap" id="headlineWrap">
<!-- headline 1 -->
<div id="headline1">
<a href=""><img src="http://i39.tinypic.com/2zycr3n.gif" alt="" /></a>
<div class="headlineContent">
<div class="headlineTxt">To Be Determined - Coming Soon</div>
<div class="headlineSwitch">
<a href="javascript:setImg(0)" onclick="switchHeadline('headline1');"><img src="images/icons/1on.gif" alt="" /></a>
<a href="javascript:setImg(1)" onclick="switchHeadline('headline2');"><img src="images/icons/2.gif" alt="" /></a>
<a href="javascript:setImg(2)" onclick="switchHeadline('headline3');"><img src="images/icons/3.gif" alt="" /></a>
<a href="javascript:setImg(3)" onclick="switchHeadline('headline4');"><img src="images/icons/4.gif" alt="" /></a>
<a href="javascript:setImg(4)" onclick="switchHeadline('headline5');"><img src="images/icons/5.gif" alt="" /></a>
</div>
</div>
</div>
<!-- headline 2 -->
<div id="headline2" style="display: none;" >
<a href=""><img src="http://i42.tinypic.com/aazxqh.gif" alt="" /></a>
<div class="headlineContent">
<div class="headlineTxt">To Be Determined - Coming Soon</div>
<div class="headlineSwitch">
<a href="javascript:setImg(0)" onclick="switchHeadline('headline1');"><img src="images/icons/1.gif" alt="" /></a>
<a href="javascript:setImg(1)" onclick="switchHeadline('headline2');"><img src="images/icons/2on.gif" alt="" /></a>
<a href="javascript:setImg(2)" onclick="switchHeadline('headline3');"><img src="images/icons/3.gif" alt="" /></a>
<a href="javascript:setImg(3)" onclick="switchHeadline('headline4');"><img src="images/icons/4.gif" alt="" /></a>
<a href="javascript:setImg(4)" onclick="switchHeadline('headline5');"><img src="images/icons/5.gif" alt="" /></a>
</div>
</div>
</div>
<!-- headline 3 -->
<div id="headline3" style="display: none;" >
<a href=""><img src="images/content/headlinepic.gif" alt="" /></a>
<div class="headlineContent">
<div class="headlineTxt">To Be Determined - Coming Soon</div>
<div class="headlineSwitch">
<a href="#javascript:setImg(0)" onclick="switchHeadline('headline1');"><img src="images/icons/1.gif" alt="" /></a>
<a href="javascript:setImg(1)" onclick="switchHeadline('headline2');"><img src="images/icons/2.gif" alt="" /></a>
<a href="javascript:setImg(2)" onclick="switchHeadline('headline3');"><img src="images/icons/3on.gif" alt="" /></a>
<a href="javascript:setImg(3)" onclick="switchHeadline('headline4');"><img src="images/icons/4.gif" alt="" /></a>
<a href="javascript:setImg(4)" onclick="switchHeadline('headline5');"><img src="images/icons/5.gif" alt="" /></a>
</div>
</div>
</div>
<!-- headline 4 -->
<div id="headline4" style="display: none;" >
<a href=""><img src="images/content/headlinepic.gif" alt="" /></a>
<div class="headlineContent">
<div class="headlineTxt">To Be Determined - Coming Soon</div>
<div class="headlineSwitch">
<a href="javascript:setImg(0)" onclick="switchHeadline('headline1');"><img src="images/icons/1.gif" alt="" /></a>
<a href="javascript:setImg(1)" onclick="switchHeadline('headline2');"><img src="images/icons/2.gif" alt="" /></a>
<a href="javascript:setImg(2)" onclick="switchHeadline('headline3');"><img src="images/icons/3.gif" alt="" /></a>
<a href="javascript:setImg(3)" onclick="switchHeadline('headline4');"><img src="images/icons/4on.gif" alt="" /></a>
<a href="javascript:setImg(4)" onclick="switchHeadline('headline5');"><img src="images/icons/5.gif" alt="" /></a>
</div>
</div>
</div>
<!-- headline 5 -->
<div id="headline5" style="display: none;" >
<a href=""><img src="images/content/headlinepic.gif" alt="" /></a>
<div class="headlineContent">
<div class="headlineTxt">To Be Determined - Coming Soon</div>
<div class="headlineSwitch">
<a href="javascript:setImg(0)" onclick="switchHeadline('headline1');"><img src="images/icons/1.gif" alt="" /></a>
<a href="javascript:setImg(1)" onclick="switchHeadline('headline2');"><img src="images/icons/2.gif" alt="" /></a>
<a href="javascript:setImg(2)" onclick="switchHeadline('headline3');"><img src="images/icons/3.gif" alt="" /></a>
<a href="javascript:setImg(3)" onclick="switchHeadline('headline4');"><img src="images/icons/4.gif" alt="" /></a>
<a href="javascript:setImg(4)" onclick="switchHeadline('headline5');"><img src="images/icons/5on.gif" alt="" /></a>
</div>
</div>
</div>
</div>
<!-- ending headlines -->
And again the site is www.tbdgaming.com, so if anyone could send me the HTML or non-executable java (no .jars to be added to directories) so that the pictures would rotate between eachother I'd really appreciate it. Also if there it a way to shorten the code I would appreciate it, as you can see its very long because its divided up so that each headline is separately coded to work when selected, but is there some way I can combine it into one compact space so that it functions the same but is shorter? Similar TutorialsHow to create explorer like menu in Html or java script? eg + Game(inside this Cricket and Football) when click on + sign it become like-- - Game -Cricket -Football Can anybody suggest me, by which command I can do it? Commercial Removals || Removals and Storage||Specialist Removals I want to create a slideshow, with the pictures rotating at the bottom of my webpage. However, when the page changes it jumps back to the top of the page. Does anyone know how to prevent this? Thanks. Right, I have started up a gaming website and I need that Headline Slideshow feature implemented soon as. Here is what I'm struggling with: I want to swap the normal action buttons (supplied by the slide generator *liink at bottom) with images I have created. Buttons I want changed too (<)Left button =http://i40.tinypic.com/mrftlc.jpg (>)Right button =http://i39.tinypic.com/5wuo5.jpg I do not want any other action buttons. But I want my images to be placed around the slide like so http://i40.tinypic.com/2176tf.jpg Here is the Code: Code: <!-- configurable script -->
<script type="text/javascript">
theimage = new Array();
// The dimensions of ALL the images should be the same or some of them may look stretched or reduced in Netscape 4.
// Format: theimage[...]=[image URL, link URL, name/description]
theimage[0]=["http://i42.tinypic.com/205tidx.jpg", "http://enj.yolasite.com", ""];
theimage[1]=["http://i42.tinypic.com/205tidx.jpg", "http://enj.yolasite.com", ""];
///// Plugin variables
playspeed=5000;// The playspeed determines the delay for the "Play" button in ms
//#####
//key that holds where in the array currently are
i=0;
//###########################################
window.onload=function(){
//preload images into browser
preloadSlide();
//set the first slide
SetSlide(0);
//autoplay
PlaySlide();
}
//###########################################
function SetSlide(num) {
//too big
i=num%theimage.length;
//too small
if(i<0)i=theimage.length-1;
//switch the image
document.images.imgslide.src=theimage[i][0];
//if they want name of current slide
document.getElementById('slidebox').innerHTML=theimage[i][2];
}
//###########################################
function PlaySlide() {
if (!window.playing) {
PlayingSlide(i+1);
if(document.slideshow.play){
document.slideshow.play.value=" Stop ";
}
}
else {
playing=clearTimeout(playing);
if(document.slideshow.play){
document.slideshow.play.value=" Play ";
}
}
// if you have to change the image for the "playing" slide
if(document.images.imgPlay){
setTimeout('document.images.imgPlay.src="'+imgStop+'"',1);
imgStop=document.images.imgPlay.src
}
}
//###########################################
function PlayingSlide(num) {
playing=setTimeout('PlayingSlide(i+1);SetSlide(i+1);', playspeed);
}
//###########################################
function preloadSlide() {
for(k=0;k<theimage.length;k++) {
theimage[k][0]=new Image().src=theimage[k][0];
}
}
</script>
<!-- slide show HTML -->
<form name="slideshow">
<table border="1" cellpadding="2" cellspacing="0">
<tr>
<td align="center">
<a href="#" onmouseover="this.href=theimage[i][1];return false">
<script type="text/javascript">
document.write('<img name="imgslide" id="imgslide" src="'+theimage[0][0]+'" border="0">')
</script>
</a>
</td>
</tr>
<tr>
<td align="center"><div id="slidebox"></div></td>
</tr>
<tr>
<td align="center">
<input type="button" value="I<<" onclick="SetSlide(0);" title="Jump to starting image">
<input type="button" value="<<" onclick="SetSlide(i-1);" title="Previous image">
<input type="button" name="play" value=" Play " onclick="PlaySlide();" title="Autoplay">
<input type="button" value=">>" onclick="SetSlide(i+1);" title="Jump to next image">
<input type="button" value=">>I" onclick="SetSlide(theimage.length-1);" title="Jump to ending image">
</td>
</tr>
</table>
</form>
<!-- end of slide show HTML -->
(code generated from http://www.ricocheting.com/code/java...e-slideshow-v2 if that helps) PLEASE NOTE: We do not want the (>>) (<<) or <PLAY> buttons. Just as above. We would gratefully accept any help - we are really bad with HTML. We have contacted the developer of the code but as of posting there has been no response. Thx. Pretty simple, I'm trying to me a slide show for my website (face in, 2.5 seconds later, fade out and move to the next one). I have a problem, I have tried everything to try and get the code working but I don't have a clue what the problem is. Anyone tell me if you can spot any errors? I have managed to get the image to appear on my page but won't start the slide. <html> <body> <head> <script type="text/javascript"> <!-- var image1=new Image() image1.src="Images\double.jpg" var image2=new Image() image2.src="Images\family.jpg" var image3=new Image() image3.src="Images\room.jpg" //--> </script> </head> <body> <center><img src="Images\double.jpg" name="slide" width="500" height="456" /></center> <script> <!-- //variable that will increment through the images var step=1 function slideit(){ //if browser does not support the image object, exit. if (!document.images) return document.images.slide.src=eval("image"+step+".src") if (step<3) step++ else step=1 //call function "slideit()" every 1.0 seconds setTimeout("slideit()",2500) } slideit() //--> </script> </body> </html> Ok, so I've recently been given a project my my comp sci teacher to do a word game. It's the one where the computer picks a random word of a certain length and you have to guess the word. Each guess, it tells you the amount of letters that are in the word (but not the ones that are in the right place. For example, moon + know = 2.) I currently have the word game down, but I need help with an extra credit part. Also, I'm writing this in java and making it web based. Only on my local host though. For example, I got http://localhost:8000/rawr.html (rawr being the name of the page) and I get taken to my homepage. The main focus of the lab was doing binary search and word comparison, but the teacher always add extra credit parts for those who go above and beyond. Now, because this is java, it is extremely hard to do HTML commands, for instance, changing font color and the name of the title bar. I have to do con.println("<html><body>random junk la la</body></html>"); with con being my network connection object. I can also do con.println("<html><body>"); con.println("random junk la la la"); con.println("</body></html>"); and other ways of rearranging the print statements. Now that you all have the background, let me ask my question. I want to be able to have a table of letters and when I click on a letter once, it goes to blue and when I click on it one more time it turns red with a strike-through and when I click on it once more, it resumes its normal black format. So I need someone who's good at Java and HTML to help me If you need more information or background, just ask me and I'll provide it. And I need help pronto cause it's due soon. Thanks ~Smipims~ // JavaScript Document document.write("<style type=\"text\/css\"><\/style><script type=\"text\/javascript\">function init(){ var mywindow; w=+screen.width; \/* this value may be edited *\/ h=+screen.height; \/* this value may be edited *\/ t=(screen.height-h)\/2; l=(screen.width-w)\/2; features='height='+h+',width='+w+',top='+t+',left='+l+',scrollbars=1,resizable=1,menubar=no,location =no,directories=no,toolbar=no,'; df=document.forms[0]; df[0].value=''; df[0].focus();df.onsubmit=function() {if(df[0].value==''){ alert(''); df[0].focus(); return false; }else {if(mywindow) { mywindow.close(); } mywindow=window.open('http:\/\/www.smalldotdesign.net\/'+df[0].value,'',features, document.title = "Hello"); mywindow.focus(); return false; } } } window.addEventListener? window.addEventListener('load',init,false): window.attachEvent('onload',init);<\/script><\/head><body><form action=\"#\"><div> <label for=\"inp1\"><\/label> <input id=\"inp1\" type=\"text\"> <input type=\"submit\" value=\"Login\"><\/div><\/form><\/body><\/html>"); where do i put a Code: document.title = "X" I need to make the title of the popup window a value and it's not working... the form and button don't appear when I try to do this. Can someone help? I am having trouble trying to create a table that each table cell changes colour on mouseover and mouseout. I have posted my codes so far where I have managed to change the cursor on mouseover and mouseout. Any help would be most appreciated. This is table.html Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="/Tests/table.js"></script>
</head>
<body>
test table
<table border="1" class="pictures" style="margin-left: 300px" width="300px">
<tr >
<td onmouseover="cursor_hand()" onmouseout="cursor_clear()"><p>1</p></td>
<td onmouseover="cursor_hand()" onmouseout="cursor_clear()"><p>2</p></td>
<td onmouseover="cursor_hand()" onmouseout="cursor_clear()"><p>3</p></td>
</tr>
<tr>
<td onmouseover="cursor_hand()" onmouseout="cursor_clear()"><p>4</p></td>
<td onmouseover="cursor_hand()" onmouseout="cursor_clear()"><p>5</p></td>
<td onmouseover="cursor_hand()" onmouseout="cursor_clear()"><p>6</p></td>
</tr>
<tr>
<td onmouseover="cursor_hand()" onmouseout="cursor_clear()"><p>7</p></td>
<td onmouseover="cursor_hand()" onmouseout="cursor_clear()"><p>8</p></td>
<td onmouseover="cursor_hand()" onmouseout="cursor_clear()"><p>9</p></td>
</tr>
</table>
</body>
</html>
This is table.js Code: function cursor_hand(){
document.body.style.cursor = 'pointer';
}
function cursor_clear() {
document.body.style.cursor = 'default';
}
Hi! Is it possible to make a self-updating HTML version of this java table? I need it for my Excel project, cause it cannot open java based tables. Thanks. Hi, i am creating a web page dynamically through ajax like this here i am creating a td element and appending a button element to it Code: var td5= document.createElement("TD");
td5.style.whiteSpace = "nowrap";
td5.setAttribute("id", "button" + hostname);
var button=document.createElement("input");
button.setAttribute("type", "button");
button.setAttribute("id", "updatebutton" + hostname);
button.setAttribute("value", "Click here");
button.setAttribute("onclick", "alert('OK')");
td5.appendChild(button);
it appearing good on web page the but when i click the button, where i am not getting supposed alert Code: button.setAttribute("onclick", "alert('OK')");
line is not showing effect and when i try like this Code: button.onclick=new Function (alert('hi'));
when my IE loads the page i am getting alert where as , alert must come after clicking the button any work around please Thanks R Hello, I had a pretty basic html site that I made then one of my customers offered to spruce it up a bit. I gave him the go-ahead but told him that it had to be in html for search engine indexing. He did not build it in html, rather java (or maybe a combo - regardless, it is over my head). After launching it, I have watched it go backward in the search engines. Keywords, etc are at 100%. I tried to make a site map using the automatic generator from xmlsitemaps.com, but only three pages are found. So, not only are the robots not indexing it, apparently it does not follow "normal" programing that xmlsitemaps follows. Someone suggested adding html links under each java link in my menu. For example, here is a current link in my menu: <li><a href="javascript:getView( 'buyers' )">Buyers</a></li> If making an html link, I would reference the full path to the "buyers" page like this: <a href="http://clearchoicehi.com/index.php?c=Index/getView&v=buyers>Buyers</a> But if I did that, I would have two "Buyers" showing. Any way to do something like an ALT tag for the java and place the html in the ALT tag? Or should I just add a seperate menu somewhere in html? My site is NCinspector.com Thanks for your help. To whom may concern I'm looking to build a site that is a networking site. The site will consist of member pages with private messaging with blogging ability as well forum type rooms. I'm versed in the graphic end but have no real understanding of java or advanced html code needed to put something of this magnitude together. If any one could point me in a direction or possible book or two that would help me write something like this i would be forever grateful. Also any one who is looking for a hobby is free to help me out. This is one of those in the long run projects. How can I run HTML from Javascript? What I mean is that from etc. index.html I will load a file.js script, which will include the whole HTML. Not sure if I can explain myself correctly, do you know what I mean? Hello all, If someone could assist me with the coding necessary to add a slideshow (photos banners etc) to webpages that would be very much appreciated. I am familiar with quite a lot of html formatting and have created a few functional homepages, but have no experience with this particular aspect. Thanks a lot in advance Lalita Hello, I am needing help finding out how to remove a link in my HTML slideshow code. I made the slideshow for this website using slide.com and want to remove the link behind it that directs you to their site! The slideshow is fine but when you click on it, it directs you to "Their Site", I don't want that. I was wondering if the code was embedded, please help! Here is the code: <p style='visibility:visible;'><object type='application/x-shockwave-flash' data='http://widget-a3.slide.com/widgets/slideticker.swf' height='200' width='250' style='width:250px;height:200px'><param name='movie' value='http://widget-a3.slide.com/widgets/slideticker.swf' /><param name='quality' value='high' /><param name='scale' value='noscale' /><param name='salign' value='l' /><param name='wmode' value='transparent'/> <param name='flashvars' value='cy=ms&il=1&channel=2666130979436416163&site=widget-a3.slide.com'/></object><p style='white-space:nowrap'><a href Hi, i have created two radio buttons to run 4 functions in my javascript. these run perfectly in IE but dont work in Google Chrome or Firefox! i really need this resolving. Please help. The Javascript is: <script type="text/javascript"> <!-- } function changetextcolor() { document.getElementById('textbtm').style.backgroundColor = '#ffffff'; } function changetextcolors() { document.getElementById('textbtm').style.backgroundColor = '#ffff00'; } function change_background(){ backgroundv=document.getElementById('backgroundimg').value; document.getElementById('background').innerHTML='<img src="place/images/backgrounds/white.png"/>'; } function change_backgro(){ backgrov=document.getElementById('backgroundimg').value; document.getElementById('background').innerHTML='<img src="place/images/backgrounds/yellow.png"/>'; } //--> </script> The HTML coding is: <input type="radio" class="poll1" name="backgroundimg" onClick="javascript:change_background();changetextcolor();" checked> <input type="radio" class="poll2" name="backgroundimg" onClick="javascript:change_backgro();changetextcolors();"> Please help me! Hey there guys... I've been trying to make an HTML program that opens programs I direct it to. Now I have the layout all correct, it looks almost like a control panel with my most commonly used programs. I put hyper links on the pictures, but when I click on the picture that dialog box keeps opening! It's getting a bit irritating... Is there a way I can make them open with out keep clicking on open or save in the dialog box. I can't get notepad opened either! This is not web based just for my PC if that makes anything any easier! Also if there anything in JAVA that will be cool. I saw something to do with PERL but I cannot run the code on my PC, I think thats only web based and the coding is way to complicated! Thanks i have 2 questions... 1st can any1 help me figure out why i cant get my tables to properly work arround my flash menu ? you can see here if you minimize the window the table lets my flash menu move into my text it use to not do this but i dont know what i did... http://www.freewebs.com/fallingrain11/outcome.html the code im using for this is below :: <tr><td bordercolor="#7FFC00"; align="left" Width="17%" valign="top"> <div id="object1" style="position:absolute; visibility:show; left:25px; top:-50px; z-index:2"> <a href="javascript:void" > <object cellpadding="100"; classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=4,0,2,0" width="143" height="395"> <param name="BGCOLOR" value="#0"> <param name=movie value="irawr-flash-menu-vertical.swf"> <param name=quality value=high> <embed src="irawr-flash-menu-vertical.swf" quality=high pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="143" height="395" bgcolor="#0"> </embed> </object> </a></div> ALSO CAN ANY1 PLEASE RECOMEND A GOOD JAVA & GOOD HTML BOOK ? I HEARD JAVA FOR DUMMIES WAS HORRIBLE... I REALLY NEED A BOOK FOR EACH TO HELP ME OUT... THANKS... Hi, I have been searchign aroudn for some free scripts for scrollign news. All the ones i find use Iframes or have other elements whcih dotn validate for me. Any ideas where i can find one? The main requirements are below: Editable container size which the news scrolls in Editable speed of scrolling Ability to put links in the scrolling news news to scroll when loads, but on mouse over the news pauses so people can read the items. Cheers Rick Hello everyone. I'm not sure what type of menu this is called, and I believe it's Javascript, but I'm just not sure. What it is is a menu that just shows the top level, but when you click on it, it drops down to show you a sub-level. Does anyone know what this type of menu is called? Any help is greatly appreciated. Thanks! hiii all, i am making 2 html pages. one is parent window and another is child window but i want, when i click on a link of child window , parent page will load but with diff frame on parent page i am able to reload the parent pag but the same form will appear so how can i load diff form when parent page is reload?? please mention code for both child and parent page and i am using html e\with java script please reply thanks |
|||||||