[CSS] Transparente Scrollbalken

Elincia
Ich hab mal eine Frage.
Wieso wird das bei mir nicht transparent?

Code von der Seite, wo das Design eingebaut ist:
code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
<!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=iso-8859-1">
<title>Layout</title>
<STYLE type="text/css">
<!--
BODY {
scrollbar-face-color: ##0000FF;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: ##0000FF;
scrollbar-darkshadow-color: #000000;
scrollbar-shadow-color: ##330066;
scrollbar-arrow-color: #000000;
scrollbar-track-color: ##00FFFF;
}
-->
</STYLE></head>

<body background="Design.jpg">
<div align="left">
</div>
<div id="Layer1" style="position: absolute;  left: 43px; top: 41px;">
  <iframe src="menu.html" name="menu" width="219" height="228" frameborder=0 scrolling="yes" noresize style="border: 0px" style="FILTER: chroma (color=#FE0000)" ;>
  </iframe>
</div>

<div id="Layer2" style="position: absolute;  left: 65px; top: 315px;">
  <iframe src="main.html" name="main" width="521" height="258" frameborder=0 scrolling="auto" noresize style="border: 0px" style="FILTER: chroma (color=#FE0000)" ;>
  </iframe>
</div>


</body>
</html>


Code von der Main-Seite:
code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
<!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=iso-8859-1">
  <title>Hauptseite</title>


  <style type="text/css">
<!--
BODY {
scrollbar-face-color: #ffffff;
scrollbar-highlight-color: #fe0000;
scrollbar-3dlight-color: #fe0000;
scrollbar-darkshadow-color: #fe0000;
scrollbar-shadow-color: #fe0000;
scrollbar-arrow-color: #ffffff;
scrollbar-track-color: #fe0000;
background-color: #000000;
}
.Stil2 {
font-size: 8pt;
font-family: Verdana;
color: #FFFFFF;
}
body,td,th {
color: #FFFFFF;
}
-->
  </style>
</head>


<body>

<div align="center">
<p><img src="WillkommenWelt.jpg" height="120" width="250"></p>

<p class="Stil2">Jaa xD<br>

Ich begr&uuml;&szlig;e euch erstmal recht herzlich auf meiner
kleinen,<br>

aber feinen Homepage.<br>

Momentan baue ich sie noch auf, also wundert euch nicht, wenn sie noch <br>

etwas leer erscheint. Ich bem&uuml;h' mich aber, dass alles schnell
fertig ist.</p>

<p class="Stil2">Ansonsten wei&szlig; ich gerade nicht
mehr, was ich noch sagen k&ouml;nnte.<br>

<br>

Jedenfalls w&uuml;nsch ich euch hier viel Spa&szlig;, schaut
euch in Ruhe um und<br>

es w&auml;re echt total lieb, wenn ihr mir einen kleinen <br>

G&auml;stebuch-Eintrag hinterlasst ;D</p>

<p class="Stil2">Bis denne mal,<br>

<strong>Anka</strong> </p>

</div>

</body>
</html>


Wär lieb wenn mir wer hilft. Es ist echt wichtig.
Die HP ist bei Funpic, und da geht es ja normalerweise auch.. Augen rollen unglücklich
Elincia
Kann mir denn echt niemand helfen? unglücklich
Ich push echt nicht gerne absichtlich, aber ich hab echt gewartet... bin um jede Hilfe froh fröhlich
Elincia
Ja ich weiß. So hatte ich es ja auch. Hier mein jetziger Code von der Main-Seite:

code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
<html>
<head>

  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  <title>Hauptseite</title>


  <STYLE type="text/css">
<!--
BODY {
	scrollbar-face-color: #FE0000;
	scrollbar-highlight-color: #FE0000;
	scrollbar-3dlight-color: #FE0000;
	scrollbar-darkshadow-color: #FE0000;
	scrollbar-shadow-color: #FE0000;
	scrollbar-arrow-color: #ffffff;
	scrollbar-track-color: ##FE0000;
	background-color: #000000;
}
-->

.Stil2 {
font-size: 8pt;
font-family: Verdana;
color: #FFFFFF;
}
body,td,th {
color: #FFFFFF;
}
-->
  </style>
</head>


<body>
<style type="text/css">body{cursor:url("http://plugin.smileycentral.com/http%253A%252F%252Fplugin%252Esmileycentral%252Ecom%252Fassetserver%252Fcursor%252Ejhtml%253Fcur%253D1%2526i%253D9a/image.gif") !important;}</style>

<div align="center">
<p><img src="Images/WillkommenWelt1.jpg" width="250" height="120"></p>

<p class="Stil2">Jaa xD<br>

Ich begr&uuml;&szlig;e euch erstmal recht herzlich auf meiner
kleinen,<br>

aber feinen Homepage.<br>

Momentan baue ich sie noch auf, also wundert euch nicht, wenn sie noch <br>

etwas leer erscheint. Ich bem&uuml;h' mich aber, dass alles schnell
fertig ist.</p>

<p class="Stil2">Ansonsten wei&szlig; ich gerade nicht
mehr, was ich noch sagen k&ouml;nnte.<br>

<br>

Jedenfalls w&uuml;nsch ich euch hier viel Spa&szlig;, schaut
euch in Ruhe um und<br>

es w&auml;re echt total lieb, wenn ihr mir einen kleinen <br>

G&auml;stebuch-Eintrag hinterlasst ;D</p>

<p class="Stil2">Bis denne mal,<br>

<strong>Anka</strong> </p>

</div>

</body>
</html>


Es tut sich nichts. Ich wollte eigentlich nur weiße Pfeile, der Rest soll transparent sein. unglücklich
Ladys Pictures
Juhu, bei mir hats jetz funktioniert.
Allerdings ist der Balken eher grau-weiß und nicht ganz 'schneeweiß', wie ich es gerne hättte.

Kann mir da noch jemand helfen? Evt. auch das die Scrolleiste an sich verschwindet?




Lg Lady
Sabrina
Also ich ahbe IE znd es funzt trotzdem nicht... habe alles schon versucht sie bleiben blau... http://sabrina3101.1page.ch/

Edit: jippie!!! Es hat geklappt!
skateboard
Ich habe diesen Code auch in den head bereich gesetz, nur es ändert sich nix?!

Der code:

code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <title>RV Lavenda</title>
  <style type="text/css">
<!--
BODY {
scrollbar-face-color: ##0000FF;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: ##0000FF;
scrollbar-darkshadow-color: #000000;
scrollbar-shadow-color: ##330066;
scrollbar-arrow-color: #000000;
scrollbar-track-color: ##00FFFF;
}
-->
  </style>
</head>
<body>
<img src="http://hoeingshof.ho.funpic.de/Design3.jpg">
<div id="Layer1"
 style="position: absolute; left: 28px; top: 218px;"><iframe
 src="http://hoeingshof.ho.funpic.de/Menue.html" name="menue"
 noresize="" style="border: 0px none ;" ;=""
 frameborder="0" height="351" scrolling="yes"
 width="204"></iframe></div>
<div id="Layer2"
 style="position: absolute; left: 257px; top: 218px;">
<iframe src="http://hoeingshof.ho.funpic.de/Willkommensseite.html"
 name="main" noresize="" style="border: 0px none ;"
 ;="" frameborder="0" height="351" scrolling="yes"
 width="507"></iframe></div>
</body>
</html>
Elincia
Huhu. Ich habe den Dreamweaver und da geht es vorerst nicht. Das liegt daran, dass oben vor dem "<html>" noch folgendes steht:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

Das ist bei dir auch. Lösch' das mal raus und schau, ob es dann geht. Bei mir ging es danach. smile
skateboard
Hallo,
ich habe nvu, und dieses da über <html> kommt immer wieder,das kann ich nicht löschen D=
cubu
Bei mir funzts au net.... hab schon alles mögliche ausprobiert, hier mal der Code, wäre echt froh, wenn mir jemand hilft!!
code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
<html>
<style>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft Editor">
<meta name="ProgId" content="Editor.Document">
<title>Design</title>
<style type="text/css">
  Body{
  scrollbar-base-color:#C6BAA2;
  scrollbar-3dlight-color:#C6BAA2;
  scrollbar-arrow-color:#000000;
  scrollbar-darkshadow-color:#C6BAA2;
  scrollbar-face-color:#C6BAA2;
  scrollbar-highlight-color:#C6BAA2;
  scrollbar-shadow-color:#C6BAA2;
  scrollbar-track-color:#C6BAA2;
  }
  </style>

</head>

<body bgcolor="#f0f8ff" topmargin="0" leftmargin="0">

<img border="0" src="http://foto.arcor-online.net/palb/alben/80/408080/1280_3630373364373533.jpg" align="left">
<div id="main" style="position:absolute; left: 286px; top: 266px;"> <iframe src="http://www.1page.ch/text_72913527_75402627_49925691_deutsch.html" name="frame2" width="549" height="352" frameborder=0 scrolling="yes" noresize style="border: 0px" style="FILTER: chroma (color=#ffffff)" ;>
</iframe>

</div>

<div id="menue" style="position: absolute; left: 286px; top: 234px;">
<iframe src="http://www.1page.ch/text_72913527_6788689_49925691_deutsch.html" name="menue" width="549" height="32" frameborder=0 scrolling="yes" noresize style="border: 0px"
style="FILTER: chroma (color=#ffffff)" ;>
</iframe>
</div>

<div id="umenue" style="position: absolute; left: 834px; top: 367px;">
<iframe src="http://www.1page.ch/text_72913527_27574817_49925691_deutsch.html" name="frame3" width="130" height="250" frameborder=0 scrolling="yes" noresize style="border: 0px"
style="FILTER: chroma (color=#ffffff)" ;>
</iframe>
</div>

</body>
</html>
skateboard
Help^^
cubu
@ Sbrina, könntest du vielleicht deinen Code reinstellen, damit wir sehen, wie er richtig aussieht!?
need Help!!!
Eva
Eli.B.
*malraufhol*

Kanns sein, dass diese transparenten Scrollbars nur bei iframes funktionieren? Ich brings nämlich auch nicht zamm.
Steffi.
XD ihr seit ein lustiger Haufen^^ also das Prinzip ist folgendes:

Damit die Scrollbar Transparent wird müsst ihr einen Filter Chroma haben.

je nachdem wie eure Filter Chroma Farbe ist, sagen wir mal sie ist: #FFFFFF müssen alle Bereiche der Scrollbar die durchsichtig sein sollen mit #FFFFFF eingefärbt werden, hier habt ihr mal eine Knallbunte Scrollbar und den passenden Code dazu damit ihr wisst welcher Bereich welcher ist (hab die entsprechenden Zeilen auch mal eingefärbt):

scrollbar-3dlight-color: #00FFFF;
scrollbar-arrow-color: #FF0000;
scrollbar-darkshadow-color: #0000FF;
scrollbar-highlight-color: #FF00FF;
scrollbar-shadow-color: #FFFF00;
scrollbar-face-color: #00FF00;
scrollbar-track-color: #000000;

das orange soll übrigens gelb darstellen XD

so also wenn ihr keinen Filter Chroma habt funktioniert das ganze nicht.

Denkt an die armen Mozilla User, die sehen alles was ihr in Chromafarbe angebt (z.B. Pink) also normale Farbe Zunge raus
Lua
Der Code geht bei mir immer, allerdings bei den mozilla-nutzern nicht. =(
code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
<STYLE type="text/css">
body { scrollbar-face-color: #ffffff;
  scrollbar-highlight-color: #ffffff;
  scrollbar-3dlight-color: #ffffff;
  scrollbar-darkshadow-color: #ffffff;
  scrollbar-shadow-color: #ffffff;
  scrollbar-arrow-color: #00000;
  scrollbar-track-color: #ffffff;
  </STYLE>
Ali
Whhaaa, bei mir gehts auch nicht
<klick>
Flicka
Huhu Avenue.
Ja, ich hab da folgendes Problem. Wo muss ich diesen Code einfügen damit die Scrollbaken auch im Main und im Menu transparent/ zu den Farben passen?
*Jana*
bei mir wird gar nix transparentunglücklich Kann mir vll. jemand helfen???
skateboard
Im Mozilla Firefox funktioniert der Code nicht - bei mir zu mindestens (;
Aber im IE, *Jana*, du musst auch im Design einen Chroma Filter haben, dann müsste es gehen..

lg
*Jana*
nein es geht nicht... ich hab die Chroma frabe #ffffff und wenn ich die auch bei den scrolldingern eingebe, ist die leiste weiß... is ja auch eig. richtig so, aber die müsste doch wie die frames durchsichtig sein?
Ali
ich hab keinen croma filter, wie mach ich den rein?