| Autor |
Nachricht |
postkomm
Threadersteller
Dabei seit: 13.05.2008
Ort: -
Alter: -
Geschlecht: -
|
|
| |
  |
 |
seal
Dabei seit: 31.07.2005
Ort: Pfalz
Alter: 41
Geschlecht: 
|
Verfasst Di 24.02.2009 19:43
Titel
|
  |
|
Wo genau hast du denn Probleme?
Bei mir im Feuerfuchs funktioniert das Menü ...
|
|
| |
|
|
|
Anzeige
|
|
|
DesignKater
Dabei seit: 26.06.2007
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 25.02.2009 10:19
Titel
|
|
|
|
Bei mir funktioniert auf der ersten Seite auch noch alles wunderbar. Erst beim klick auf Folgeseiten fehlen die aktiven Hintergrundbilder und das Menü fängt an beim MouseOver zu springen.
|
|
| |
|
|
Smooth-Graphics
Dabei seit: 22.05.2006
Ort: -
Alter: -
Geschlecht:
|
Verfasst Mi 25.02.2009 10:33
Titel
|
|
|
Zeig doch bitte mal deinen entsprechenden CSS Code, den du umgeschrieben hast 
Dann kann man dir viel besser helfen. Ich denke, es geht auch um das Problem, das DesignKater angesprochen hat?
|
|
| |
 |
|
postkomm
Threadersteller
Dabei seit: 13.05.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst So 01.03.2009 18:09
Titel
|
|
|
Das ist der CSS Code:
| Code: | /*-----------------------------------------------------------------------------
Overlapping CSS Navigation
version: 1.0
date: 09/12/06
author: george ornbo
email: george at shapeshed dot com
Licensed under a 2.0 Creative Commons License
-----------------------------------------------------------------------------*/
*
{
border:0;
margin:0;
padding:0;
}
body
{
margin: 10px 0px 0px 10px;
width:490px;
font: 76%/150% "Lucida Grande", "Trebuchet MS", Tahoma, Verdana, sans-serif;
color:#000;
text-align:left;
}
/*-----------------------------------------------------------------------------
Define the width of the nav div
-----------------------------------------------------------------------------*/
#nav
{
width:427px;
height: 39px;
}
#nav ul
{
list-style:none;
width: 427px;
height: 39px;
}
#nav li
{
list-style: none;
display: inline;
text-align: center;
}
#nav li a
{
text-decoration: none;
display:block;
float:left;
background: url(pix/all_states.png) no-repeat;
text-indent:-9999px;
}
/*-----------------------------------------------------------------------------
Define the width of each li item. This is used as a letter box to show the
correct part of the background image
-----------------------------------------------------------------------------*/
li#home a {
width:117px;
height:39px;
}
li#about a {
width:104px;
height:39px;
}
li#services a {
width:101px;
height:39px;
}
li#contact a {
width:103px;
height:39px;
}
/*-----------------------------------------------------------------------------
Position the background image within the left boxes we have created. Use hover states
to show the correct background position for hover states.
A negative margin is used to show the whole tab. As this doesn't work in IE a
separate stylesheet is used for IE6 and below.
-----------------------------------------------------------------------------*/
li#home a:link, li#home a:visited {
background-position: -0px -0px;
}
li#home a:hover, li#home a:focus {
background-position: -1px -39px;
}
li#about a:link, li#about a:visited {
background-position: -117px 0px;
}
li#about a:hover, li#about a:focus {
background-position: -89px -78px;
width: 132px;
margin-left: -28px;
}
li#services a:link, li#services a:visited {
background-position: -221px 0px;
}
li#services a:hover, li#services a:focus {
background-position: -191px -78px;
width: 131px;
margin-left: -30px;
}
li#contact a:link, li#contact a:visited {
background-position: -321px 0px;
}
li#contact a:hover, li#contact a:focus {
background-position: -293px -117px;
width: 132px;
margin-left: -28px;
}
/*-----------------------------------------------------------------------------
Set the on states using the body id.
-----------------------------------------------------------------------------*/
body#home-page li#home a:link, body#home-page li#home a:visited {
background-position: 0px 0px;
}
body#home-page li#about a:hover, body#home-page li#about a:focus {
background-position: -89px -39px;
width: 132px;
margin-left: -28px;
}
body#about-page li#about a:link, body#about-page li#about a:visited {
background-position: -89px -39px;
width: 132px;
margin-left: -28px;
}
body#about-page li#home a:hover, body#about-page li#home a:focus {
background-position: -0px -0px;
overflow: auto;
position: relative;
}
body#about-page li#services a:hover, body#about-page li#services a:focus {
background-position: -191px -156px;
width: 131px;
margin-left: -30px;
}
body#services-page li#services a:link, body#services-page li#services a:visited {
background-position: -191px -200px;
width: 131px;
margin-left: -30px;
}
body#services-page li#about a:hover, body#services-page li#about a:focus {
background-position: -89px -233px;
width: 132px;
margin-left: -28px;
overflow: auto;
position: relative;
}
body#services-page li#contact a:hover, body#services-page li#contact a:focus {
background-position: -293px -266px;
width: 132px;
margin-left: -28px;
position: relative;
}
body#contact-page li#contact a:link, body#contact-page li#contact a:visited {
background-position: -293px -299px;
width: 132px;
margin-left: -28px;
}
body#contact-page li#services a:hover, body#contact-page li#services a:focus {
background-position: -191px -332px;
width: 131px;
margin-left: -30px;
overflow: auto;
position: relative;
}
body#contact-page li#blogs a:hover, body#contact-page li#blogs a:focus {
background-position: -400px -332px;
width: 129px;
margin-left: -25px;
overflow: auto;
position: relative;
}
|
Sicherlich alles nur eine Frage der Positionierung. Aber wie?
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
wie erstelle ich diesen menü effekt bzw. das gesammte menü?
CSS Menü - Finde nicht das richtige Menü
Pop up menü
CSS Menü
CSS-Menü
[help] Menü - IE
|
|
Willkommen auf dem Portal für Mediengestalter
