hideFocus=true auf nächster Seite ausführen

**mitdreissiger** · 26.03.2008 10:35

hideFocus=true auf nächster Seite ausführen

ich habe eine Seite in der die Übersicht aller Werkstätten aufgeführt sind.
Die einzelnen Arbeitsbereiche sind klickbar. Sie führen
mit einem Anker zu der nächsten Werkstattseite. Dort
habe ich mit css und this.hideFocus=true die einzelnen
Arbeitsfelder sichtbar und unsichtbar gemacht.
Jetzt möchte ich, das ich von der Überischtsseite mit
einem Klick zur Werkstattseite komme und natürlich
soll der Arbeitsbereich auch gleich sichtbar (aufgeklappt
werden). Ich such schon nen ganzen Tag nach dieser Möglichkeit.
Hier der Link zur Übersichtsseite:

http://www.g-p-z.de/wbo/uebersicht_01.html

und der Code

HTML-Code:

<a href="wbo_bruder.html#flasche" target="_self" ><img src="gif/punkt.gif" width="20" height="20" border="0" /></a>

HTML-Code:

]<a class="hid" href="#more" onclick="this.hideFocus=true" onblur="this.hideFocus=false"><span> <img src="gif/flaschen.gif" width="70" height="61" /></span> <em><br />
  <img src="gif/flaschen.gif" width="40" height="27" border="0" />
 <ul>
  <li><strong>Lebensmittelabf&uuml;llung</strong><br />

In separaten Food Bereichen in Ravensburg oder Wangen f&uuml;llen wir mit Halbautomaten und/oder manuell trockene und fl&uuml;ssige Lebensmittel in T&uuml;ten, Beutel, Folien, Bechern und Flaschen ab.<br />
  Ebenso erledigen wir f&uuml;r Sie die vor-und nachgelagerten T&auml;tigkeiten wie mischen, etikettieren und kommissionieren.</li>   
</ul><a name="flasche" id="flasche"></a>
  </em></a></p>

css code

HTML-Code:

.holder {
	width:570px;
	font-size: 1em;
	background-color: #E6D7BE;
	padding: 2px;
	border: 1px solid #94212D;
}
.holder h2 {
	text-align:left;
	font-size: 1.0em;
	color: #94212D;
	font-weight: bold;
}

.holder img, a img  {
	border: 1 solid #94212D;
	font-size: 1em;
	font-weight: normal;
}


a.hid ul li {
	list-style-position: outside;
	list-style-type: none;
	padding-left: 50px;
	font-size: 1em;
	font-weight: normal;
}
a.hid em {display:none;}
a.hid:hover {
	text-decoration:none;
	color: #94212D;
}
a.hid:active, a.hid:focus {
}
a.hid:active span, a.hid:focus span {
	display:none;
	color: #94212D;
}
a.hid:active em, a.hid:focus em {
	display:block;
	width:100%;
	font-style:normal;
	cursor:default;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	background-color: #E6D7BE;
}

Vielen Dank für Eure Hilfe

mitdreissiger

**Boris** · 26.03.2008 12:58

Vergib der anderen Seite eine ID über body (z.b. <body id="andereseite">) und setz dann im CSS einen entsprechende Angabe rein, z.B.

body#andereseite .wasauchimmer
{
display: block;
}

**mitdreissiger** · 26.03.2008 14:44

Zitat von Boris

Vergib der anderen Seite eine ID über body (z.b. <body id="andereseite">) und setz dann im CSS einen entsprechende Angabe rein, z.B.

body#andereseite .wasauchimmer
{
display: block;
}

Hallo,
Danke erstmal für Deine Antwort.
Leider gehts nicht.
Wo genau in der Seite soll ich die ID vergeben? Im body selbst?
Hast Du bemerkt das die Links und Anker auf den roten Punkten sitzen?

Danke für Dein Bemühen.

BG mitdreissiger

**Boris** · 26.03.2008 16:46

Ja, auf body. Was was bedeutet "leider gehts nicht" ... kannst du uns deinen Versuch zeigen?

Was für rote Punkte?!?

**mitdreissiger** · 26.03.2008 18:56

Hallo,

hier der link:

http://www.g-p-z.de/wbo/uebersicht_01.html

BG Marcus

**mitdreissiger** · 26.03.2008 18:59

Sorry fast vergessen!
Hier die css Datei

* {
margin: 0;
padding: 0;
}

html {
}
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 75%;
color: #94212D;
background-color: #94212D;
}

body#bruder .flasche
{
display: block;
}
p {
font-family: Arial, Helvetica, sans-serif;
font-size: 1.0em;
color: #96222F;
}

h1 {
color: #94212d;
font-family: Arial, Helvetica, sans-serif;
font-size: 1.6em;
font-weight: bold;
line-height: 1.3em;
font-style: normal;
}
h2 {
font-size: 1.8em;
color: #FFFFFF;
font-variant: small-caps;
vertical-align: middle;

}
img, a img {
border: 0;
}

a {
color: #FFFFFF;
font-size: 1em;
text-decoration: none;
font-weight: bold;

}
a:visited {
color: #FFFFFF;

font-size: 1.0em;
text-decoration: none;
}

a:hover {
color: #0F0162;

font-size: 1em;
text-decoration: none;
}

a:active {

color: D97F7F;
font-size: 1em;
text-decoration: none;
}
.break {
word-break: break all;
}
#nachoben {
color: #94212D;
text-align: right;

}
#nachoben a {
color: #94212D;

}
#nachoben a:hover{
color: #574D92;

}

/* Basisdefinitionen */

#alles {
width: 1000px;
color: #fff;
background-color: #94212D;
margin-right: auto;
margin-left: auto;
height: auto;
}

#header {
color: #fff;
width: 1000px;
}
#logo {
color: #fff;
background-image: url(../jpeg/logo_wbo.jpg);
background-repeat: no-repeat;
height: 150px;
background-position: 8px;
}
#mainnavi {
background-color: #668;
height: 15px;
font-size: 1.0em;
margin-left: 200px;
font-family: Arial, Helvetica, sans-serif;
background-position: center;
text-align: right;
}

#main {
margin-left: 200px;
background-color: #e6d7be;
margin-right: 200px;
padding: 5px;
font-size: 1.0em;
}

#main ul, li {
color: #94212D;
list-style-position: inside;
}

/* Basisdefinitionen */
#menu {
width: 180px;
list-style-type: none;
float: left;
font-size: 1.0em;
background-color: #95212E;
padding-left: 5px;
}

#menu a {
text-decoration: none;
display:block;
width: 180px;
margin-bottom: 10px;
padding-left: 5px;
}
#menu li {
list-style-position: outside;
}
#menu li a {
background-color:#94212d;
color: #fff;
display:block;
padding: 3px;
}
#menu li a:hover {
background-color:#BC7E81;
color: #FFFFFF;
display:block;
width: 183px;
}
#menu li a:active {
display:block;
width: 180px;
font-weight: bold;
color: #FFFFFF;
background-color:#666688;
padding-left: 5px;
}

#right {
float: right;
width: 200px;
color: #fff;
background-color: #94212D;
}
.holder {
width:570px;
font-size: 1em;
background-color: #E6D7BE;
padding: 2px;
border: 1px solid #94212D;
}
.holder h2 {
text-align:left;
font-size: 1.0em;
color: #94212D;
font-weight: bold;
}

.holder img, a img {
border: 1 solid #94212D;
font-size: 1em;
font-weight: normal;
}

a.hid ul li {
list-style-position: outside;
list-style-type: none;
padding-left: 50px;
font-size: 1em;
font-weight: normal;
}
a.hid em {display:none;}
a.hid:hover {
text-decoration:none;
color: #94212D;
}
a.hid:active, a.hid:focus {
}
a.hid:active span, a.hid:focus span {
display:none;
color: #94212D;
}
a.hid:active em, a.hid:focus em {
display:block;
width:100%;
font-style:normal;
cursor:default;
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
background-color: #E6D7BE;
}

.clear {clear:both;}

#footer {
color: #fff;
background-color: #668;
background-position: right;
text-align: right;
clear: both;
}
#platz {
width: 580px;
background-color: #00FF00;
visibility: hidden;
height: 200px;
}

.Stil1 {
color: #94212D;
font-size: 1.1em;}

.holder_leer {
width:800px;
background-color: #E6D7BE;
padding: 2px;
height: 200px;
visibility: hidden;
}

**Boris** · 26.03.2008 19:06

Ähm, was soll body#bruder .flasche? Du musst das schon korrekterweise dem Element geben, das du mit display: none versteckst.

**mitdreissiger** · 26.03.2008 20:23

Hallo,

musst schon entschuldigen, ich auch nur ein Mensch und
ein Anfänger der noch lernt, DESSHALB wende ich mich
an das Forum, warum sonst, wenn's ich wüßte müsste ich
nicht fragen.
Vielleicht kann Du mir die Lösung, ohne nur Stichpunkte zu
geben, geben?

BG mitdreissiger,

Danke nochmal für die Hilfe.

zur Startseite vom TP

Thema: hideFocus=true auf nächster Seite ausführen

LinkBack

Themen-Optionen

Thema durchsuchen

Thema bewerten

hideFocus=true auf nächster Seite ausführen

Aktive Benutzer

Aktive Benutzer