|
HTML - Need Help With A Switch Content Script.
I found this script that I found very interesting and would probably be very helpful to me, but I have little idea on how to use it. Could someone break it down for me and explain how I can use it on my website?
The code can be found here the 8th post down by Bill Posters. Thank you very much. Similar TutorialsEllo I'm a complete newb so sorry if I'm posting in the wrong place guys. Could anybody out there help me make a field / box like the one on this site. http://www.laptopsdirect.co.uk/Acer_...62/version.asp Below the laptop is a large field, if you click things like "technical specification" etc, it changes only that field. Then if you press the back button it backs up to the last page, rather than the last configuration of the current page. Phew.. confusing myself now lol. Anyhoo, just want to know how I would make such a box, with tabs that change that box only? Thanx Sarah hi im designing a we site by php i have a html form that collect some information from client an it has some script for hide or visible text box when user check a checkbox but when client run my page see a popup menu allowed blocked content.... i saw some site do this withou running this popup how can i do it? thanks Hi, Im trying to make my footer content align correctly to the main content when a window resizes. The apdivs don't seem to want to move at all even with a relative position etc. I have tried everything but just cant get it to work can someone help please? http://pjm.co.uk.uksite4.yourwebserv...splay&PageID=5 Also some one commented before on the amount of css and JS pages. These will al be stripped out as its an Open sources system im using! Thansk alot Joe Firstly, please forgive me for explaining this poorly or if it isn't even a matter of html. I want to make a very simple on/off switch to put on my site which any visitor can click on or off. Just some visual representation of on or off - a lightswitch, a red and green button, etc. It'll have no other function than being on or off. I know how to build an image that would do this. What I don't know is how to make it reflect the true on or off position that somebody most recently switched it to. As I know how to build it, it would simply load to its default position as the visitor's page loads. I want people to be able to visit and see that the light is either on or off. If this makes sense to anyone, any suggestions how I might do it? Thanks! Looking for the cleanest way to enable the following: I have 2 forms on 1 page. The user has to choose which one is best for them. Upon selection(based on product they purchased) they then get the approriate form. I have the forms built, but Im not sure on the best route for the switch. DHTML? Thanks, Mac How do I switch between iframes within a page? Example: link1 | link2 | link3 |----------------------| |----------------------| |-------iframe--------| |----------------------| |----------------------| I want the iframe to chage when I click the different links, is this possible? I'm brand new to writing script but my boss wants me to make this work. In the main image the water tank, pump manifold and the small pump above the tank should change into the different image when mouseovered. This is what I've come up with. ------------------------ <html> <head> <SCRIPT LANGUAGE="javascript"> <!--PRELOAD IMAGES> Original = new Image(800,542) Original.src = "http://fulfordsupply.com/frameset/images/BoilerRoom/Original.jpg.) Tank = new Image(800,542) Tank.src = "http://fulfordsupply.com/frameset/images/BoilerRoom/Tank.jpg" Pump = new Image(800,542) Pump.src = "http://fulfordsupply.com/frameset/images/BoilerRoom/Pump.jpg" Station = new Image(800,542) Station.src = "http://fulfordsupply.com/frameset/images/BoilerRoom/Station.jpg" </script> </head> <IMG NAME="Original" SRC="http://fulfordsupply.com/frameset/images/BoilerRoom/Original.jpg" USEMAP="#BoilerRoom"> <script language = javascript> <!--FUNCTIONS> <script language="javascript"> function zoomtank() { document.Original.src = Tank.src; return true; } function zoompumpstation() { document.Original.src = Station.src; return true; } function zoompump() { document.Original.src = Pump.src; return true; } function original() { document.Original.src = Original.src; return true; } </script> <!--THE MAP> <MAP NAME="BoilerRoom"> <AREA SHAPE="rect" ALT="Tank" COORDS="545,200,745,500" HREF=tank.jpg onMouseOver="zoomtank()" on MouseOut="original()"> <AREA SHAPE="rect" ALT="PumpStation" COORDS="258,207,370,345" HREF="Station.jpg" onMouseOver="zoompumpstation()" on MouseOut="original()"> <AREA SHAPE="rect" ALT="Pump" COORDS= "710,55,780,130" HREF="pump.jpg" onMouseOver="zoompump()" on MouseOut="original()"> </MAP> </html> ------------------ I've tried running it through the tryit editor @ http://www.w3schools.com/html/tryit....=tryhtml_basic but all i'm getting is the main image. The maps all work and i'm gonna fix the links eventually but I cannot for the life of me get my commands to work. I've been working on this is 9am (its 530 here now) so this is the last avenue I can think of for help. If someone could give me a helping hand I'd really appreciate it! Hey guys, I used to know a lot about html, but then just completely stopped doing anything with websites for too long. I was just wondering how I can replace a word or number with a specified word or number. What I want to achieve: I've got a forum with a couple thousand members and it's picking up in activity and I want to make some names stand out for being helpful. I want to replace their names with an image. But to do so, it'd have to be a code made and added into the footer template. Because obviously I can't edit a username for html image code. So I just need the code to find all instances of a certain username and replace it with what I specified. ------------- Man I really wish I remembered how to do this haha. Thanks guys. Hi board members I trust I have posted in the correct forum... I've just coded an excel speadsheet for all my videos. I have created hyperlinks to each file. I'm wondering if there is a switch to add to the end of the hyperlink to force the media player the open in full screen? Any help would be appreciated. Cheers, Mal Hey all, new here and not a very good coder at all, but i find pieces of information and try and make best of it....and as far i can see i cant find this sort of information on this website my problem is im trying to create a code that will log in to a website, wait a few (i.e. 2 seconds) then go to a second web page that is a part of this site for example --> www.htmlforum.com --> (automate login) --> then go to www.htmlforum.com/example this is what i have found so far </head> <body> <FORM action=http://www.thewebsiteexample.com/login.php method= post name=login> <INPUT class=login_input type=hidden name=usrname value="myusername"> <INPUT class=login_input type=hidden name=uemail value="myemail@hotmail.com"> <INPUT class=login_input type=hidden name=peeword value="mypassword"> <INPUT class=login_input type=submit value=Login> <body onload="document.login.submit();"> </form> </body> this code allows me to log in successfully to the site i wish to go to i also have this code to allow loading of a new page (but works only AFTER successfully logged in) <script> <!-- location.replace("http://www.mywebsiteexample.com/arms.php"); --> </script> my problem is i dont know how to join the code, whereby i successfully log in, then run the script to go to the subpage my idea is to delay running of the script code perhaps? which should then allow to successfully load the subpage...or perhaps you guys know another way help is DEFINITELY very appreciated! cheers all! First I would like to know if there is a better way of doing this. <div></div> is the only way I know of doing it although others have told me they didn't even know it could be done with <div></div>. Second I would like to know if there's some way to control the speed at which the box scrolls. Third If the content is text then I want the scroll function to be vertical. There's other times I need the scroll to be horizontal. Here is the code: HTML Code: <div style="background-color: black; border-bottom-color: rgb(212, 47, 212); border-bottom-style: solid; border-bottom-width: 2px; border-left-color: rgb(212, 47, 212); border-left-style: solid; border-left-width: 2px; border-right-color: rgb(212, 47, 212); border-right-style: solid; border-right-width: 2px; border-top-color: rgb(212, 47, 212); border-top-style: solid; border-top-width: 2px; font-size: 11px; height: 200px; overflow-x: auto; overflow-y: auto; width: 200px;"> <span style="color:#ffffff;">CONTENT HERE</span></div> This is what the code looks like when viewed in Chrome and Firefox. However when used in IE the content can often move through the boarders. Here is my website for starters: http://divinedragons.tk If you navigate to my Schedules page, you can see there is an embedded calendar. At the bottom of this calendar, there is a line of text saying: "Want to add an event to this schedule? Contact us by clicking on the link above, and we will post it as soon as possible." I view this website on the current computer I'm using on Firefox, and the line of text can be viewed just perfectly. On my other networked computer, however, in MSN Explorer, i view the same page, but the same line of text seems to be too large, and it cuts off half the phrase. I was thinking the screen resolution was different, and that caused the text to be cut off in the browser. Yet i think there is a way for this line of text to be viewable on any computer, regardless of any screen resolution. I put the embedded code in a table format, as it is currently. The embedded code is with between the tags <TABLE><TD> and </TD></TABLE>. I remember looking somewhere that putting code in a table would cause it to appropriately "resize" itself in any monitor/screen resolution/browser size. Apparently it does not. So, I came here to ask an HTML expert if there is any way for my embedded calendar's footer text to be fully viewed, in any screen resolution or browser. Thanks for your time, and thanks so much in advance. hi, i have a problem i don't know how to solve. i have a web template i designed and in the middle of the template i have something written. now what i need to do is when user clicks on the button it should load the different page that has everything the same except the middle text. i know i can do this by creating a new template and just put in the different text in ti and then create a link to this page but when you have a hudge amount of different middle data it becomes pretty difficult to administrate all. so my question know is how to create a template html script that can only change its middle context by loading different txt file so i don't have to write a new html template for every text file that i want put into my page sorry if this is not written properly but i'm still learning.... thnx Hi all, brand new here. I'm working on a simple website for a project I'm doing with a friend, but I'm having a problem with the layout. The site is www.Project217.com. On my Macbook, the content on all of the pages appears centered, which is where I want it. Firefox, Safari and IE all display properly. However, on my Windows computer at work all of the content within the black section of the pages is aligned to the left. Is there an issue with my source code that I'm missing? Thanks for any help, Aaron When I start adding the content to my website, it pops up on top of the menu and the logo in the top of the page? Do you know what I can do to get it under the menu? Here is my HTML and CSS Code HTML Code: HTML Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset-UTF-8" /> <title>Andersen Undercover Records</title> <link rel="stylesheet" type="text/css" href="page.css" /> </head> <body> <ul id="nav"> <TABLE BORDER=0 BORDERCOLOR=black width="700"> <TR><td> <li><a href="#">HOME</a></li></td> <td><li><a href="#">ARTISTS</a></li></td> <td><li><a href="#">MUSIC</a></li></td> <td><li><a href="#">NEWS</a></li></td> <td><li><a href="#">VIDEOS</a></li></td> <td><li><a href="#">PHOTOS</a></li></td> <td><li><a href="#">ABOUT</a></li></td> <td><li><a href="#">CONTACT</a></li></td> </tr> </ul> <div id="content"> </body> </html> CSS CODE Code: * {
margin: 0;
padding: 0;
}
body {
font-size: 62.5%;
font-family: Helvetica, sans-serif;
background: url(images/background.png) repeat-x top
}
li {
font-size: 1.2em;
}
p {
font-size: 1.0em;
line-height: 1.4em;
margin-bottom: 0.8em;
}
ul#nav {
height: 290px; width: 894px;
margin: 0 auto;
background: url(images/logo.png) no-repeat;
list-style: none;
}
ul#nav li a {
display: block;
margin-top: 298px;
float: left;
width: 50px;
margin-left: 52px;
color: grey;
font-weight: bold;
text-decoration: none;
padding-top: 2px;
}
ul#nav li a:hover, ul#nav li a:active {
color: white;
div#content {
padding-bottom: 50px;
float:left;
}
div#footer {
background: url(images/)
color: white;
padding: 10px 0 10px 0;
text-transform: uppercase;
border-top: 0px solid black;
text-align: center;
}
This is my first post, and I am new to html so here goes. I am working on a project using google earth. I need to have the screen divided into a quad panel. I was using a table 2x2 to do this, but the project has progressed to needing a little more than just a table. So as of now I have 2 divs and only one will display the plugin. I am not even sure if I am in the right direction, but here is my code. <style type="text/css"> <!-- #pane1 { border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: #000000; border-right-color: #000000; border-bottom-color: #000000; border-left-color: #000000; height: 50%; width: 50%; left: 0px; top: 0px; } #pane2 { border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: #000000; border-right-color: #000000; border-bottom-color: #000000; border-left-color: #000000; height: 50%; width: 50%; right: 0px; top: 0px; } </style> <div id="pane1"> <script src="http://www.google.com/jsapi? key=ABQIAAAA1XbMiDxx_BTCY2_FkPh06RRaGTYH6UMl8mADNa0YKuWNNa8VNxQEerTAUcfkyrr6OwBovxn7TDAH5Q"></script> <script type="text/javascript"> var ge; google.load("earth", "1"); function init() { google.earth.createInstance('pane1', initCallback, failureCallback); } function initCallback(instance) { ge = instance; ge.getWindow().setVisibility(true); // add a navigation control ge.getNavigationControl().setVisibility(ge.VISIBILITY_AUTO); // add some layers ge.getLayerRoot().enableLayerById(ge.LAYER_BORDERS, true); ge.getLayerRoot().enableLayerById(ge.LAYER_ROADS, true); // in this sample we will attempt // to fetch a KML file and show it function finished(object) { if (!object) { // wrap alerts in API callbacks and event handlers // in a setTimeout to prevent deadlock in some browsers setTimeout(function() { alert('Bad or null KML.'); }, 0); return; } ge.getFeatures().appendChild(object); var la = ge.createLookAt(''); la.set(37.77976, -122.418307, 25, ge.ALTITUDE_RELATIVE_TO_GROUND, 0, 0, 500); ge.getView().setAbstractView(la); } // fetch the KML var url = 'http://example.com/' + 'kml/Network_links/RMLS/NL_Sched_rmls_Outages_by_Creator_and_Int.kml'; google.earth.fetchKml(ge, url, finished); document.getElementById('installed-plugin-version').innerHTML = ge.getPluginVersion().toString(); } function failureCallback(errorCode) { } </script> <body onLoad="init()" > </div> <div id="pane2"> <script src="http://www.google.com/jsapi? key=ABQIAAAA1XbMiDxx_BTCY2_FkPh06RRaGTYH6UMl8mADNa0YKuWNNa8VNxQEerTAUcfkyrr6OwBovxn7TDAH5Q"></script> <script type="text/javascript"> var ge; google.load("earth", "1"); function init() { google.earth.createInstance('pane2', initCallback, failureCallback); } function initCallback(instance) { ge = instance; ge.getWindow().setVisibility(true); // add a navigation control ge.getNavigationControl().setVisibility(ge.VISIBILITY_AUTO); // add some layers ge.getLayerRoot().enableLayerById(ge.LAYER_BORDERS, true); ge.getLayerRoot().enableLayerById(ge.LAYER_ROADS, true); // in this sample we will attempt // to fetch a KML file and show it function finished(object) { if (!object) { // wrap alerts in API callbacks and event handlers // in a setTimeout to prevent deadlock in some browsers setTimeout(function() { alert('Bad or null KML.'); }, 0); return; } ge.getFeatures().appendChild(object); var la = ge.createLookAt(''); la.set(37.77976, -122.418307, 25, ge.ALTITUDE_RELATIVE_TO_GROUND, 0, 0, 500); ge.getView().setAbstractView(la); } // fetch the KML var url = 'http://example.com/' + 'kml/Network_links/RMLS/NL_Sched_rmls_Outages_by_Creator_and_Int.kml'; google.earth.fetchKml(ge, url, finished); document.getElementById('installed-plugin-version').innerHTML = ge.getPluginVersion().toString(); } function failureCallback(errorCode) { } </script> <body onload="init()" > </div> I have a page that is not being centered on the background in both IE 6&7 but looks perfect in FF. I am not sure what is wrong because the template I used is vaild Here is the page http://www.mesquitechristmas.com/wea...Z119&icao=KHQZ I have been banging my head all day an maybe just need another pair of eyes. -Thanks Hey guys, need a little help with a site im playing with right now. I have a basic site (header, footer, nav, content, and promo area) i use ul, li, a for the nav. When i hover my navigation links it supposed to display black for 1st and second level, and i use the visibility element for anything higher than than. However when i hover i can see my navigation but alot of it is hidden behind my content. Any Ideas. Thanks In Advance for any help. P.S. Just another quick question i created my own java carousel and it works great but i want to add links in my nav to a specific "slide" in my carousel which i think woulod require a link to the page and to call a javascript function at the same time is this possible or is there another way to do it. how can i put html table in a .doc file without border. That means i dont want to show border of html table in doc file. i put the border="0" but doc file display border by default. may anyone help. |
|||||||