Demo

Probiere ClanSphere aus und teste daran herum. Demo


Antworten: 10
Seite [1]
Dafoxx


King for a day





Beiträge: 244
 # Thema - 26.02.2009 um 17:53 Uhr
hi... ich mal wieder xD
neueste frage:
kann man "img onmouseover" so hinbiegen, dass man über das bild, dass ja als link fungiert, nene schriftzug kloppen kann?
also nicht für jeden button 2 bilder erstellen muss (eins als standart -> onmouseout + src und eins als aktiver button -> onmouseover). bis jez hab ichs nur geschafft, dass der text, zwar auch verlinkt, HINTER dem button selbst erscheint.
htmlcode um dens geht: +-
<tr>
<td><a href="index.php?mod=news&amp;action=recent"><img onmouseover=src="images/news2.jpg" onmouseout=src="images/news1.jpg" height="20" src="images/news1.jpg" width="160"></a></td>
</tr>
<tr>
<td><a href="index.php?mod=contact&amp;action=mail"><img onmouseover=src="images/kontakt2.jpg" onmouseout=src="images/kontakt1.jpg" height="20" src="images/kontakt1.jpg" width="160"></a></td>
</tr>

usw....

website in signatur, es geht um die buttons in der linken navleiste.... die mit dem text der.... naja... "optisch suboptimal" ist

wär cool wenn hier auch jemand so gut bescheid wüsste wie bei den wehwechen davor

(achja... gibts irgendne schmerzgrenze/nervlimit? ich will schliesslich auch net das forum komplett zumüllen mit meinen noob-fragen....)

*EDIT:
also:
ich wollte für meine hp buttons, die sich verfärben, wenn man mit der maus drüberfährt.
hab ich geschafft (dank euch )
jetzt gefällt mir (perfektionist :S) der schriftstyle nicht, und ich hab für jeden button mit gimp ein eigenes bild erstellt, mit eigenem text usw. (nachteil war nicht nur die aufwendige arbeit, sondern die dadurch längeren ladezeit der HP)
deswegen: kann ich den background qwasi auch mit mouseover austatten?
so in der art
<tr>
<td height="30" background=[img onmouseover=src="images/backround2.jpg" onmouseout=src="images/background1.jpg" height="20" src="images/background1.jpg"]>
<a href="index.php?mod=contact&amp;action=mail"></a>
<div align="center" class="Stil2"><font color="#000000">TEXT</font></div>
</td>
</tr>

also dass über dem sich verfärbenden background noch ein text steht^^
(memo to self: nie lehrer werden, du kannst einfach nicht erklären)


Zuletzt editiert von Dafoxx am 26.02.2009 um 18:22 Uhr (3x Editiert)
Inaktiv
duRiel ClanSphere Team


Weltmeister




Herkunft: Cambridge
Beiträge: 7300
 # Antwort: 1 - 26.02.2009 um 18:07 Uhr
hi,
es gibt kein nervlimit, solange du dir mühe für deine beiträge gibst und durch struktur der frage und durch nennen aller relevanten daten überzeugst.
das sehe ich bei diesem post nicht ganz. versuch es bitte nochmal klarer zu formulieren, ich blicke da nicht durch ohne dreimaliges lesen und dafür fehlen mir zeit und nerv.

gruß
duRiel


Inaktiv
|
Dafoxx
Thread-Ersteller


King for a day





Beiträge: 244
 # Antwort: 2 - 26.02.2009 um 18:25 Uhr
so.... dickes edit gemacht... ich hoffe das bringt etwas licht in die sache...
und ich hoffe ich bemüh mich genug...^^
ich mein.... ich hoff es kommt net so rüber als würde ich von irgendwem verlangen meine HP komplett nach meinen wünschen zu modelieren^^
Inaktiv
|
duRiel ClanSphere Team


Weltmeister




Herkunft: Cambridge
Beiträge: 7300
 # Antwort: 3 - 26.02.2009 um 18:34 Uhr
okay, schon besser.
wenn ichs richtig verstanden hab, kannst du das easy mit css machen.

gib dem button die klasse hoverbutton (class="hoverbutton").
dann gehst du in eine css datei und schreibst:
.hoverbutton {
background: url('deinbild.jpg');
}
.hoverbutton:hover {
background: url('deinhoverbild.jpg');
}


gruß
duRiel


Inaktiv
|
Dafoxx
Thread-Ersteller


King for a day





Beiträge: 244
 # Antwort: 4 - 26.02.2009 um 18:47 Uhr
hmm alles klar... leuchtet mir ein
nur wie binde ich das ganze in html ein?
ich hab (noch) von nix wirklich ne ahnung....^^
(schonmal n thx an dieser stelle)
einfach background=hoverbutton ?


Zuletzt editiert von Dafoxx am 26.02.2009 um 18:47 Uhr (2x Editiert)
Inaktiv
|
duRiel ClanSphere Team


Weltmeister




Herkunft: Cambridge
Beiträge: 7300
 # Antwort: 5 - 26.02.2009 um 18:53 Uhr
steht in der klammer


Inaktiv
|
Dafoxx
Thread-Ersteller


King for a day





Beiträge: 244
 # Antwort: 6 - 26.02.2009 um 18:59 Uhr
*ausprobier*
(sry hatte grad ne schlaflose nacht........ und nicht wegen irgendwas gutem -.-)
geht nix -.-
irgendwo mach ich n fehler....
/edit:HTML-ZEILE: +-
<td height="20" background="images/menue_left_link.jpg"><a href="index.php?mod=board"><class="hoverbutton"><font color="#000000">TEST</font></class></a>

CSS: +-
.hoverbutton {
background: url('images/menue_left_link.jpg');
}
.hoverbutton:hover {
background: url('images/menue_left_link2.jpg');
}


also ich habs jez mal getested und hochgestellt.... aber wie man sieht (erster button in der navleite links): nix :S
(memo to self: HTML und PHP lernen)


Zuletzt editiert von Dafoxx am 26.02.2009 um 19:13 Uhr (3x Editiert)
Inaktiv
|
duRiel ClanSphere Team


Weltmeister




Herkunft: Cambridge
Beiträge: 7300
 # Antwort: 7 - 26.02.2009 um 20:28 Uhr
lol

class ist ein html attribut, kein element. das muss einem element, normalerweise dem link, zugeordnet werden.

ich empfehle, den aufbau der kompletten navigation neu zu machen. das erleichtert erstens den einbau dessen, was du gerade machen willst, und zweitens kann das logischer, einfacher und schneller gemacht werden.


die ganze navigation ist mithilfe von tabellen aufgebaut. das ist vollkommen unnötig. die navigation besteht aus links und so sollte auch der aufbau aussehen: schlichte links, keine einbettung in komplizierte tabellen.

du kannst mal einen link über die anderen machen (nur mit <a> tag) und den dann versuchen auszugestalten. zum beispiel so:

<a class="navi" href="index.php?mod=news&amp;action=recent">News</a><br />


und in der css datei:

.navi {
display: block;
width: 160px;
height: 120px;
background: url('images/news1.jpg');
}
.navi:hover {
background: url('images/news2.jpg');
}


viel erfolg,

duRiel


Inaktiv
|
Dafoxx
Thread-Ersteller


King for a day





Beiträge: 244
 # Antwort: 8 - 26.02.2009 um 22:56 Uhr
hmmmm
also.. hab beides (fast) so wie dus beschrieben hast....
wenn ich das kurz überreissen darf.... (bin ja wie du gemerkt hast noch ECHT neu in der branche)
.navi {
display: block;
width: 160px;
height: 120px;
background: url('images/news1.jpg');
}
.navi:hover {
background: url('images/news2.jpg');
}

=box für 6 links a 20pix höhe und 160 pix breite.... ich habs einfach zum testen umgestellt
url hab ich auch verändert nach images/menue_left_link.jpg bzw menue_left_link2.jpg .
sollte ja eigentlich kein problem darstellen.
leider funzt des net..... muss ich dazu vllt noch irgend was machen wie cache leeren oder so?

also: mein probelink is jez dieser:
<tr>
<td><a class="navi" href="index.php?mod=news&amp;action=recent">News</a>
</td>
</tr>


(<br/> spaar ich mir auf, bis des eine funzt..... brauch man ja für einen link net... oder?)

die css sieht nach meinen verunstaltungen so aus:

.navi {
display: block;
width: 160px;
height: 20px;
background: url('images/menue_left_link.jpg');
}
.navi:hover {
background: url('images/menue_left_link2.jpg');
}


also für mich klingt das alles ganz logisch.... falls irgendwer den nerv hat bzw ne bestimmte idee: hier noch die komplette ccs :S


css +-
body {
background-color: #000000;
font-family: Verdana;
font-size: 11px;
color: #E0E0E0;
font-weight: bold;
}
a:link {
font-family: Verdana;
color: #E0E0E0;
text-decoration: none;
font-weight: bold;
font-size: 11px;
}
a:visited {
font-family: Verdana;
color: #E0E0E0;
text-decoration: none;
font-weight: bold;
font-size: 11px;
}
a:hover {
font-family: Verdana;
color: #FFBF00;
text-decoration: none;
font-weight: bold;
font-size: 11px;
}
a:active {
font-family: Verdana;
color: #E0E0E0;
text-decoration: none;
font-weight: bold;
font-size: 11px;
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
/* End hide from IE-mac */
img {
border:0px;
}
form {
display:inline;
}
input, textarea, select {
color:#000000
width:90%;
background-color: #870000;
}
ul {
margin:0px;
}
#content {
text-align:center;
}
#bottom {
width:100%;
}
#head {
color:#870000;
font-size:25pt;
height:100px;
text-align:center;
width:100%;
}
#debug {
height:150px;
margin-bottom:20px;
overflow:auto;
width:100%;
text-align:left;
}
#errors {
color:#CC3300;
}
#sql {
color:#000000;
}
.h1 {
color: #870000;
font-size: 14pt;
font-weight: bold;
text-decoration: none;
}
.h2 {
color: #870000;
font-size: 16pt;
font-weight: normal;
text-decoration: none;
}
.h3 {
color: #870000;
font-size: 20pt;
font-weight: normal;
text-decoration: none;
}
.form {
color:#FFFFFF;
font-family:Verdana,Helvetica,sans-serif;
font-size:8pt;
padding-left:3px;
}
.forum {
background-color:#0A0A0A;
border: 1px solid #000000;
}
.headb {
background-color:#870000;
color:#FEFEFE;
font-weight:bold;
font-size:10px;
text-align:left;
}
.bottom {
background-color:#000000;
text-align:left;
}
.newshead {
background-color:#0A0A0A;
color:#870000;
font-size:12px;
font-weight:bold;
text-align:left;
}
.left,.center,.right {
padding:1px;
}
.leftb,.centerb,.rightb {
color:#FEFEFE;
}
.leftc,.centerc,.rightc {
background-color:#000000;
color:#FEFEFE;
}
.left,.leftb,.leftc {
text-align:left;
}
.center,.centerb,.centerc {
text-align:center;
}
.right,.rightb,.rightc {
text-align:right;
}
.quote {
background-color:#3A0D0F;
color:inherit;
text-align:left;
}
.navhead,.navhead2 {
background-color:#000000;
color:#E0E0E0;
font-weight:bold;
text-align:center;
border: 1px solid #000000;
}
.navbodyb,.navbody2b {
color:inherit;
list-style:none;
text-align:left;
}
.Stil1 {font-weight: bold}
.Stil2 {font-weight: bold; font-size: 10pt; }
.bg {
background-color: #000001;
}
.rahmen {
border: 1px solid #000000;
}
.rahmen_bannerrotion {
border-top-width: 3px;
border-right-width: 3px;
border-bottom-width: 3px;
border-left-width: 3px;
border-top-style: inset;
border-right-style: inset;
border-bottom-style: inset;
border-left-style: inset;
}
.calevent {
background-color:#FF0000
}
.navi {
display: block;
width: 160px;
height: 20px;
background: url('images/menue_left_link.jpg');
}
.navi:hover {
background: url('images/menue_left_link2.jpg');
}


*frustriert*
Inaktiv
|
duRiel ClanSphere Team


Weltmeister




Herkunft: Cambridge
Beiträge: 7300
 # Antwort: 9 - 27.02.2009 um 11:20 Uhr
du hast die css datei nicht hochgeladen, die änderungen stehen online nicht drin.

und dieses einbetten in <tr> und <td> sollst du ja gerade nicht machen. mach den link vor der tabelle, also vor dem <table ...>.


Inaktiv
|
Dafoxx
Thread-Ersteller


King for a day





Beiträge: 244
 # Antwort: 10 - 27.02.2009 um 16:17 Uhr
AAAAAAAAAAAH
nie wieder nach ner durchgemachten nacht versuchen was zu basteln....
DANKE!
es funzt perfekt.... (auch wenn ich den link in die tabelle integriert hab.... )

fazit:
kopf -> wand
und
duRiel = dickes thx

greez, fox
(und sorry, der letzte post wär unnötig geworden, wenn ich mich erstmal ausgeschlafen hätte xD)

CAN B CLOSED


Inaktiv
|

Dieses Thema wurde von Ramires ClanSphere Team PM geschlossen.
Antworten: 10
Seite [1]