|
HTML - Time-based Image
The new iGoogle uses a time based image where the color of the sky corresponds to the time of day eg. it is bright when it is light out and dark when it is dark out. I want to make a image for a business website that displays open when it is between certain hours and closed when it is not those hours. Any guidance on where to look or how to approach this?
Similar Tutorialshi when u surf to my forum. u will see the images a real short time in a place on the screen where they should not be. right after that they are being positioned by css. surf to www.acidleague.com and all goes well, but then click on forum and u will see this issue, then u can click home-forum-home-forum to see it really clear the wierd part is that this is happening only by divs i added myself to the code i made these divs in the overal_header.html page <div id="sidebarleft"></div> <div id="sidebarright"></div> <div id="cornerleft"></div> <div id="cornerright"></div> and uses this css on em #sidebarleft { padding: 0px; float: left; margin: 0; position:absolute; width: 600px; left:-599px; top:0px; height:600px; background-image:url(http://www.acidleague.com/League/the...eader_bg.jpg); background-repeat:repeat-x; } #sidebarright { padding: 0px; float: left; margin: 0; position:absolute; width: 600px; left:999px; top:0px; height:800px; background-image:url(http://www.acidleague.com/League/the...eader_bg.jpg); background-repeat:repeat-x; } #cornerleft { padding: 0px; float: left; margin: 0; position:absolute; width: 47px; left:-46px; top:192px; height:49px; background-image:url(http://www.acidleague.com/League/the...bg/tleft.jpg); } #cornerright { padding: 0px; float: left; margin: 0; position:absolute; width: 47px; left:999px; top:192px; height:49px; background-image:url(http://www.acidleague.com/League/the...g/tright.jpg); } whats is the most common way to stop this? ty Hi there I am an HTML novice that can usually find the answers after some google time, not this time though. I've been searching the web for quite some time to get this done, hopefully one of you can help me out. If so, I will gladly give you credit when my little digital art project is done. Here's what I am trying to do (simplified): - I have image files (.JPGs) named 1200.jpg, 1201.jpg, 1202.jpg, 1203.jpg, 1204.jpg, etc. Each one representing a minute in the day. - Is it possibly to have a browser display 1201.jpg at 12:01, then display 1202.jpg at 12:02 and so on? Reading from the system clock. Hopefully this makes sense. Thanks for your time and, um, keep on HTML-ing. Dorron M email@dorronm.com Hi all -- I'm having an interesting problem. I'm designing a web page that has a navigation banner (home - programs - schedule of events - contact us - downloads) that is made up of a .png for each page (i.e. home.png, programs.png, etc). My page is 1000px wide and all of the navigation banner's images add up to 1000px wide. I'm using JavaScript to create an onMouseOver and onMouseOut effect on each of the images. The problem that I'm having occurs when I tried to add a link (either by <A HREF= or using an image map). Whenever I add a link to the image, a small (3px) area of white space shows up to the right of the image. This shifts all of my other images 3px to the right (and 3 more for each link I add to subsequent images) thus making the total width of the navigation banner over 1000px and the last image gets shoved to a new line. I can find no way to get rid of this white space other than to remove the link from the image. There is no property on the page that adds any sort of padding, margins, or borders to images or links, so I can see no property that has to be changed. Help! How do I get rid of this white space but still keep the link on the image?? [I posted this question on the Adobe forum to no avail, below is a screencap I took of the issue I'm having] Thanks in advance! //kl PS - I am using both IE8 and Chrome to view this webpage. I've set all the margins/padding/borders to 0px. Here is my CSS and the part of the code that pertains to the navigation banner. CSS: Code: <style type="text/css">
<!--
body {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background: #666666;
margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
padding: 0;
text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
color: #000000;
background-image: url(images/blue.bg.png);
background-repeat: repeat;
background-color: #009;
}
.oneColFixCtr #container {
width: 1000px; /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
background: #FFFFFF;
margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
border: 0px solid #000000;
text-align: left; /* this overrides the text-align: center on the body element. */
}
.oneColFixCtr #mainContent {
padding: 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
}
body, td, th {
color: #333;
}
#main_banner2 {
margin: 0px;
padding: 0px;
height: auto;
width: 1000px;
}
-->
</style>
</head>
Nav Banner: NOTE:: below HAS to be all one paragraph because if i insert a carriage return in between images, it also adds the white space... Code: <body class="oneColFixCtr"> <!-- MAIN NAVIGATION BANNER --> <!--HOME--><img src="images/nav/home.png" alt="home" name="home" width="82" height="30" border="0" onMouseOver="document.images.home.src='images/nav/home_over.png'" onMouseOut ="document.images.home.src='images/nav/home.png'"/><!--PROGRAMS--><img src="images/nav/programs.png" width="111" height="30" border="0" name="programs" onMouseOver="document.images.programs.src='images/nav/programs_over.png'" onMouseOut ="document.images.programs.src='images/nav/programs.png'"/><!--SCHEDULE OF EVENTS--><img src="images/nav/scheduleofevents.png" width="189" height="30" border="0" name="scheduleofevents" onMouseOver="document.images.scheduleofevents.src='images/nav/scheduleofevents_ over.png'" onMouseOut ="document.images.scheduleofevents.src='images/nav/scheduleofevents.png'"/><!-- CONTACT US--><img src="images/nav/contactus.png" width="119" height="30" border="0" name="contactus" onMouseOver="document.images.contactus.src='images/nav/contactus_over.png'" onMouseOut ="document.images.contactus.src='images/nav/contactus.png'"/><!--DOWNLOADS--><i mg src="images/nav/downloads.png" width="267" height="30" border="0" name="downloads" onMouseOver="document.images.downloads.src='images/nav/downloads_over.png'" onMouseOut ="document.images.downloads.src='images/nav/downloads.png'"/><!--FACEBOOK--><im g src="images/nav/facebook.png" width="90" height="30" border="0" name="facebook" onMouseOver="document.images.facebook.src='images/nav/facebook_over.png'" onMouseOut ="document.images.facebook.src='images/nav/facebook.png'"/><!--TWITTER--><img src="images/nav/twitter.png" width="67" height="30" border="0" name="twitter" onMouseOver="document.images.twitter.src='images/nav/twitter_over.png'" onMouseOut ="document.images.twitter.src='images/nav/twitter.png'"/><!--BLOGGER--><img src="images/nav/blogger.png" width="75" height="30" border="0" name="blogger" onMouseOver="document.images.blogger.src='images/nav/blogger_over.png'" onMouseOut ="document.images.blogger.src='images/nav/blogger.png'"/><img src="images/home_banner.png" alt="home_border" width="1000" height="7" /><br /> I need to know how to make an html/javascript based script to make a VERY simple address bar that acts exactly like the address bar on all web browsers. When you type in where you want to go.. well.. It takes you to the url you just typed in! No restrictions are needed (anti-porn for example) and I'm hoping it can be in the shape of a regular old form script that is easily editable. Please don't ask why the hell I would need one but I just do. Thanks in advance Okay, I am completely lost on this one. I need to create a string of code that will allow a user to submit a certain value into a form field. Then, when they click the submit button, they are taken to a specific page based on the value that they entered??? This has to be HTML only, hence my problem. Basically, this is a poor-mans online account system. A customer enters their account number into the form field, hits the submit button and are taken to their account page which is password protected. I know, I know, this could be easily done with PHP or using simple htaccess but I have to use HTML only on this one. Not sure if I am asking the correct question in the correct case, so please advise. Question: More and more I am seeing web pages that appear to be based more on javaScript/CSS than on conventional HTML/HTMLX. An example that comes to mind is the Dropbox web site. Is my observation/conclusion correct or are these web pages just HTMLX/CSS? If they are based on JavaScript/Jquery, are there environments for developing these web sites or are they all custom coded? Thank you for your patience... Todd I completeted a layout for a website using the slice tools in Photoshop....all I have to do now, is put text, pictures, etc etc into the fields necessary. I am having a lot of trouble with this. I am wanting to make a background image in a cell fixed so I can put text ONTOP of it so it doesn't mess up the entire table layout. I want that cell to have scrollbars. Does that make sence? Ive been to w3schools.com site and when I put in the code they ask me to, it doesn't work. Im probably doing something wrong. The website isn't online, however, I can paste the code that was generated if that is needed. Thank you for your help. Hi, I'm trying to modify an HTML-based RSS ticker that I've found online. For reference, the code can be found at http://www.rsspump.com. Currently, the code is written to display a certain number of recent posts (for my purposes, tweets from a Twitter account). The default setting displays anywhere between 1-9 of the most recent posts. The issue is that I am using the ticker to display a list of daily announcements. The number of announcements we tweet varies from day to day, and become irrelevant once the day is over. Is there a way to rewrite this code so that the posts (tweets) displayed are based on the day they are posted rather than the number of recent posts? For example, instead of displaying my 5 most recent tweets, I'd like to display everything I've tweeted today and only things I've tweeted today. I hope that makes sense. Anyways, I've posted the code below. Thank you so, so much to anybody who can help. <iframe src="http://s1.rsspump.com/rss.aspx?s=00000000-0000-0000-0000-000000000000&speed=2&t=0&d=0&u=0&p=1&b=0&ic=9&font=Verdana&fonts ize=12px&bgcolor=&color=000000&type=typewriter&su=1&sub=1&sw=1" frameborder="0" width="100%" height="16" scrolling="no" allowtransparency="true"></iframe><noframes><div style="background-color: none transparent;"><a href="http://www.rsspump.com/?web_widget/rss_ticker/news_widget" title="News Widget">News Widget</a></div></noframes> Hello, I'm a bit stuck with how to code this so if anyone can rattle this off in seconds I'd really appreciate them doing so: Rather than have visitors to my site click on a flag to visit a page based on their country of residence I want them to click one URL, then the code on this page work out if they are from UK, USA, or any other country and re-direct them to either page 1, page 2 or page 3. Is there a way for this to be done? Thanks. i have a floating div who's height is determined by content, i would like acquire that div's hight and apply it's hight to a div on the page, when the page loads... Hello there, I always make webpages using tables. The usual outline for me is a vertical menu bar at the left that is of STATIC width, and a window on the right that displays the conent with a DYNAMIC width. So I pretty much want the left pane to take up i.e. 200px and the right pane to take up the rest of the page. With tables, it's easy b/c you can just set the table width to 100%, define the td width of the left pane, and the right pane will automatically resize itself to fill the page. I'm trying to adapt a div-based layout now and I can't figure out how to do that with divs. I've been playing with it, but keep running into problems. If I set float:left, after a certain point in making the window narrower, the right div jumps below the left div, etc.. Can someone give me some hints or point me in the right direction as to how to achieve the same effect I had using tables? Thanks! The "mailto:" code is fine for a link that has people send an email, IF they are using a non-web-based email program such as Outlook. But if a person is using, say, hotmail, and doesn't know how to configure hotmail as their default email program, how can I write html code that will take them to this kind of web-based email site for writing their email? I have a client who doesn't understand why she can't use the email link I've set up.. Please help! Hello. =) A few weeks ago, I made this thread saying that I'm (basically) still new to HTML...and now I'm forcing myself to use an HTML editor. (I decided to use KompoZer, and I've been using it for a few days.) Right now, I'm playing around with it and trying to create different site layouts. I came up with a design (which involves using DIVs), but I'm really having some problems: What the site is supposed to look like [GIF image] What the site actually looks like (for now) [HTML document - CSS is embedded in the page] ...Truth be told I drew that picture first, then I went online and found a similar-looking layout (since I can't make one from scratch yet; I still don't really understand how DIVs+CSS work). So I tried modifying the layout as best I could, and I didn't do such a great job. ^^; Anyway, I want the layout to be "liquid", so if you resize your browser everything shrinks nicely. But whenever I reduce my browser size, the header and footer start moving. How do I stop this from happening? Can anyone tell me the correct code I should be using? Thanks in advance!! PS: 1) You see those "white spaces" in the picture I drew? Well, I figure the best way to add those spaces is by modifying some background images, like what I did here. If I'm wrong, or you know a better way to do this, please tell me!! 2) If you scroll the HTML document, you might notice that it's hard to read the top line of text (because it's "hidden" behind the header DIV). I think the best way to solve this problem is by making the bottom of the header DIV transparent...or, by adding a second DIV at the bottom of the header, and then making that second DIV transparent. I heard you can use "filter:chroma" to do this, but for some reason I can't get it to work with hex colors OR pictures. =( 3) Do you think it's easier/makes more sense to try and edit this other layout instead? It scrolls the same way, and it already has a header and footer...plus the bottom of the header is already a different color, so I should be able to make it transparent. This layout doesn't have a side column, but I can make one using code like this, right?: HTML Code: body {
color: white;
background-color: #000000;
background-image: url(stars_bg3.gif);
background-image: url(foot-head.gif) bottom 300px right;
background-repeat: no-repeat;
background-attachment: fixed;
border-top: 6px solid white;
border-right: 0;
border-bottom: 6px solid #FFFFFF;
border-left: 6px solid #FFFFFF;
padding-left: 184px;
overflow: hidden;
margin: 0px;
}
Hello, I was wondering if it is possible to filter visitors to a website based on their location. For example: If a Visitor is from Ohio, route them to ohio.html If a visitor is from Montana, rote them to montana.html. I'm not sure how to make this happen, any help would be greatly appreciated. Thanks, Brian Hi guys, I have a lengthy HTML page with terms and conditions. At the top of the page, there will be a few check boxes. If certain check box is checked, then the content will be shown. If the check box is empty, then the content will be suppressed. Is there a way to suppress a content based on user check boxes? Thanks! Dear expert (Ok, i am new to this and should maybe not address this as a letter ) I hope someone can help me ... this is what i want to achieve (I am using frontpage) I want to create a table (this i can do!) that require a user input (number of guests). It then has SEVERAL options: - Select an option from a drop down list, and a price is then loaded from somewhere to create a total for that option and display it in the table (And keep that total for adding later) - Check a box, and if checked it creates a further calculation, displaying and storing the number for further calculation. a number of the above options, and a grand total on the bottom. I found more or less a page on a site that does what i am looking for, but after looking at the code, i have even LESS of an idea how it works Can someone PLEASE help me, or point me in the right direction? (I am not looking for someone to just write the code for me, as this will not teach me anything, and i want to learn) Below is a link to the example .. http://www.ouma-se-kombuis.co.za/test.html Thank you! Hi again! I am thinking of another project. I wanted to make/remake our software user manual in HFLM file. I want its file size to be small as possible, so I do not want to use CMS. How should I accomplish it. I want to use a temple with all the links in the header. Your comments and suggestions are highly appreciated. Thanks a lot. Hey guys, i'm just starting up with html, and am having a few problems. I have a php file titled "stats.php" that return results when you direct your url to: /stats.php/default/dricho Its a dynamic sig generator through a php file. I have created a form that allows you to simply add in the details so that it generates the link for you. But i am having an issue. here is the form: HTML Code: <form action="http://www.domain.com/sig/stats.php" method="post"> <select name="background"> <option>maple</option> <option>default</option> </select> Name: <input name="rsn" type="text" /> <input type="submit" /> </form> How can i make it so teh results open a link based on teh items chosen? i.e. if i chose maple and input dricho it would direct the url to: "/stats.php/maple/dricho"? All help is greatly appreciated, Daniel hi, because im having trouble configuring my website to work seamlessly (the way i want it) with both firefox AND internet explorer, i was wondering if there was a way that i could make a script that would load the appropriate CSS file for that browser (that i would create of course) and because in internet explorer (havnt had chance to test in firefox) my website looks messed up in some resolutions is there a way i could create a script that would also choose the correct CSS for the users resolution? Thanks people, i know im asking a lot of you guys, but everyone ive spoken to seems so professional and know what they are doing Seasons greetings everyone! I'm a pretty big HTML newbie, but I've read that in order to get my favicon to work in IE, I have to add a certain line of code to my page. I've done that, and it still doesn't work. The page is he www.matthoover.com The line of code I added is: <link rel="shortcut icon" href="http://www.matthoover.com/favicon.ico" /> Can anybody please view my source and provide any insight? Thanks! |
|||||||