|
HTML - Button Layer
Hello,
Please point me in the direction of button-layers. In other words: How do I make a whole layer act as a link so that when a user clicks anywhere within a layer (and not ONLY on the link in the center of it), the whole layer acts as a button? Thank you for your expertise! Similar Tutorialsmy hyperlink on the flashbutton is not working in FF (the button is placed in a div layer) Can someone help me?? Thank you Greets Denise didn't get a reply in the css forum, here is the site.. http://www.pomatrock.brevard.k12.fl.us/goodnews.html the css file is attached as a word doc. if you go to any of the years..(2k5,2k6 etc) there is a div on the left side, used to cover up the dark brown with a light brown. Problem is, in Firefox it shows up way too long and adds a long extension of brown from the bottom of the page, but in IE it looks just fine. Some help would be greatly appreciated. :-D thanks. hi all, is there a way to have a div layer 100% in height and 100% in width? thanks This is kind of hard to explain so I hope you stay with me. I have a site and everytime you navigate to a page everything is loaded. The same images the same background everything. So I firgured to help save the load time of pages I would make a frameset. Since the Only thing the on my site that changes is one layer with new text. Unfortunately, the frameset won't work. I use hidden layers as a drop down navigation for a few buttons when you hover over them. So if I were to use a framset the layer would then drop down but the mainframe would cover up the drop down navigation (which is a layer). I tried figuring out to get a layer to show up over all frames but I had no luck. I also messed around with z index but that still didnt work. So my question is... is it possible to get a layer to change but not the entire page? Here is the site, www.griffithband.com If you look you will see that layer17 is the only layer that changes. Is there a way to get that to be the only thing to change when going to a new page rather then the entire page? Layers 31, 30, and 29 are the drop down navigation, and the reason why I cannot use the frameset as they will not show becuase they go underneath the mainframe. I'm in no way very fluent with any coding. I only work on this site and thats it. Thanks in advance. Here's the CSS code: HTML Code: <style type="text/css">
<!--
body {
scrollbar-arrow-color: #425B5E;
scrollbar-base-color: #98A5A6;
scrollbar-face-color: #98A5A6;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #425B5E;
scrollbar-3dlight-color: #DEE7E8;
scrollbar-track-color: #DEE7E8;
scrollbar-darkshadow-color: #DEE7E8;
}
div#content {
width: 600px;
margin-left: auto;
margin-right: auto;
text-align: left;
}
.header {font-family: trebuchet MS; size: 11px; color: white; font-weight: none;
BORDER-RIGHT: none 1px solid;
BORDER-TOP: none 1px solid;
BORDER-bottom: white 1px solid;
BORDER-LEFT: none 1px solid; background-color: #660000;}
.head2 { font-family: verdana; font-size: 11px; color: #4A4A5B; background-color: #FFFFFF; border: #4A4A5B; border-style: solid; border-left-width: 0px; border-right-width: 0px; border-top-width: 1px; border-bottom-width: 1px; text-align:center; background-repeat: no-repeat; font-weight: bold; letter-spacing: 1px; text-transform: uppercase;}
.head { font-family: verdana; font-size: 14px; color: #64657E; background-color: none; border: #75AAB0; border-style: solid; border-left-width: 0px; border-right-width: 0px; border-top-width: 0px; border-bottom-width: 0px; text-align:center; background-image: url(head.gif); background-repeat: no-repeat; font-weight: bold; height: 26px; padding-top: 4px;}
b { color: #6D82A1; font-size: 11px; font-weight: bold; }
A:link
{color:#beb8b8;text-decoration:none; cursor: default; font-weight: bold; border-bottom: 1px #C5CADC solid;}
A:visited
{color:#beb8b8;text-decoration:none; cursor: default; font-weight: bold; border-bottom: 1px #C5CADC solid;}
A:active
{color:#beb8b8;text-decoration:none; cursor: default; font-weight: bold; border-bottom: 1px #C5CADC solid;}
A:hover
{color:#5b1435;text-decoration:underline; cursor:default; font-weight: bold; border-bottom: 1px #000000 solid;}
body
{background-color: gray;
background-attachment: fixed;
background-repeat: repeat-y;
background-position: left;
font-family: arial;
color: black;
margin: 0px;
letter-spacing: 0px;
font-weight: normal;
font-size: 12px;
cursor: default;}
td { font-family: trebuchet ms; font-size: 11px; color: black; font-weight: normal; }
-->
</style>
And here's the text itself; HTML Code: <html>
<head>
<link rel="stylesheet" media="all" type="text/css" href="simple/simple.css" />
<script src="simple/click_menu.js" type="text/javascript"></script>
<link rel="stylesheet" href="style.css" type="text/css">
<title>Ironman Football Academy | Don Bosco Prep</title>
</head>
<body onload="clickMenu('menu')">
<center><img src="mainimage.png">
<ul id="menu">
<li class="sub"><a href="#nogo1">Home</a>
<ul>
</ul>
</li>
<li class="sub"><a href="#nogo1">Information</a>
<ul>
</ul>
</li>
<li class="sub"><a href="#nogo1">Registration</a>
<ul>
</ul>
</li>
<li class="sub"><a href="#nogo1">Don Bosco Prep</a>
<ul>
</ul>
</li>
</ul>
</center>
</div>
<div id="content" style="position: absolute; z-index: 2; margin-left:auto; margin-right:auto;
top: 303px; width: 600px; height: 0px; overflow: visible">
<div class="header"> Welcome</div>
We plan to change C-5 plane in such a way that the limitations and hazards involved with them might disappear or be
lessened, advancing the study of aeronautics and its applications in technology. As the group researches the flaws
associated with the structural mechanics, equipment, materials, and technology, we will develop a plan to inspire a
more efficient plane. <a href="http://donboscoprep.org/istf/skystar/component2/task1.php"">Task 1</a>
</div>
</html>
Why isn't the text (with the header welcome) not centered? Hello all, I'm having some trouble getting html to display in my <layer> tags, for example if I use the code: HTML Code: <layer src = "myfile.html"> The file that I'm trying to display does not show, even though it is in the same local directory. Has anyone else ever tried this successfully? Thanks! I created the css below. It is a list that contains my navigation buttons on the left hand side of the page. The buttons work good. Now, I want to add some pictures to the left of the buttons. When I do this a space becomes apparent between the buttons. (top & bottom). I tried adding a layer but like I said it creates a space between buttons. Any help is appreciated. Thanks,. .Blockhead #navcontainer { width: 200px; } #navcontainer ul { margin-left: 0; padding-left: 0; list-style-type: none; font-family: Arial, Helvetica, sans-serif; } #navcontainer a { display: block; padding: 3px; width: 160px; background-color: #669966; border-bottom: 1px solid #eee; ; background-image: none } #navcontainer a:link { color: #FFFF00; text-decoration: none; } #navcontainer a:hover { color: #33FF99; ; background-image: none ; background-color: #669999 } #navlist a:visited { color: #CCCCCC; text-decoration: none; this issue has been solved H guys, I have a page that has a div layer which contains a table of 2 columns and numorous rows. I have managed to get the scrolling to work but i am having trouble keeping it in one place in all browsers. whenever i publish it through diferent browsers - i.e for examples shifts the entire div to the right and up. How do i fix the position of this div? Please help... Hi All... I'm building a website in Dreamweaver 8. I have one layer in the site that contains a form field for collecting email addresses. The layer is placed on top of an image. When I horizontally resize my browser window the layer moves. When I resize the browser vertically it stays in place. I've tried switching the layer properties from relative to absolute and back again but it doesn't make a difference. Could someone please have a look at the page and see if they have any suggestions? The link is http://www.sweetdivinemusic.com/storycollective This is the last piece I need to fix before taking the site live. Thanks a ton folks! Robert I want the border to fit the entire way around the text and the image. Currently the border only fits around text and image horizontally and it cuts some of the image vertically. How can I resolve this? 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">
<style type="text/css">
.holder{
border: solid 1px black;
width: 800px;
margin: 20px;
padding: 5px;
}
.holder img{
float: right;
}
</style>
</head>
<body>
<div class="holder">
<img alt="google image" src="http://nathan-sanders.com/wp-content/themes/portfolio/images/portfolio/nsold-thumb.jpg">
<p>text text text text text text text text text text text text text text text text
text text text text text text text text text text text text
text text text text text text text text text text text text
</p>
</div>
</body>
</html>
Thanks in advance Calypso Hi guys, I have a problem with the layers, i'm trying to make a button that have a behavior which make visible an invisible layer, perfect, it works, but i need that this happen over a video qt, but te video doesn't allow that. I mean, if under tha layer are an image or text, the layer is over that items, right, but when under the layer are a video qt or a flash movie, the layer apear under them, i tried inclusively with the "z-index" but it didn't work either; if you know how to do that, i would appreciate any help about it. Thanks... I'm trying to centre and image with in a layer, both vertically and horizontally but I'm having no joy. I've tried normal HTML but would I be better off creating a second CSS? Any help on the coding with either would be a great help! Ian I know IE7 sucks but i need my website to be viewable in it. First look at my site in Firefox, then IE7 if you have it. The menu shows up properly in firefox, but not in IF7. Any ideas how to make IE7 show the menu properly? Thanks link: http://www.dynamitedave.com/redesign/index_1.html Hi, I'm working on a project and I want layers stacked to be visible and invisible through a button. Anyone here that buys books on Amazon knows what I'm talking about. Some books in Amazon have a "look inside" that when you click it opens like a layer where you can see some content of the book. This layer or whatever it is has an X button to close it. This is what I want to do, but I don't have an idea of how this can be accomplished. Any help will be appreciated. Thanks I wanted my page appear in such a way that when an index page is loaded the login screen appear and the background is freeze till the login is accepted then the login screen dissapear. How can i achieve this ? I tried looking for similar example but i doesnt seems to be able to find any. i am looking for something similar to this http://www.pageflakes.com/default.aspx i know.. stupid question.. i should know how to do this.. but i dont.. how do i make a layer appear when i link is clicked? i want to have [?] next to something, and when clicked, a layer becomes visible that shows some text, then when an X on the layer is clicked, the layer becomes invisible again i know it has to do with visible=true/false.. but idk what to do.. help please I have a site which I regularly update but rather than using a flat colour for some of the cells I am now using images as a cell background. This obviously has ramifications when putting text over the top cause the depth of colour means the text can be hard to read. What I want to do is create a layer in the cell which means that the text sits on a opaque layer which is lighter than the background image. My intended desired effect would be similar to what is at http://iankearns.dialnet.com/images/desired_effect.jpg or as attached but rather than doing this as an image I would prefer to do it as HTML or DHTML (is possible) as this would mean changing the text easier Thanks to anyone who can assist |
|||||||