PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : Mit CSS2 quote


dadie
04.12.2004, 12:18
Hi ,

Mithilfe von CSS2 kann man ja Text objektesozusagen verändern z.b. so

Quelle http://www.html-world.de/program/css_15.php


CITE, EM { quotes: '>>' '<<' '»' '«'; }
CITE:before, EM:before { content:open-quote; }
CITE:after, EM:after { content:close-quote; }

/* ... macht aus: */
<cite> Text <em> Text </em> Text </cite>

/* ... das: */
<cite> >>Text <em> »Text« </em> Text<< </cite>


So nun möchte ich aber das Jedes A oder a durch <img src="./img/a.png" alt="A" >
ersätz wird im spaqn class teil mit den namen "test2"

Nur wie geht das ? Ich kann aus den Obigen code einfach nicht schliessen wie ich das mache :(


MFG

Dadie
Dingsi
04.12.2004, 12:43
Mit dem Code da lässt sich das afais nicht machen. Aber Image-Replacement lässt sich auch anders lösen:
<h3 id="header"><span>Revised Image Replacement</span></h3>

/* css */
#header {
width: 329px;
height: 25px;
background-image: url(sample-opaque.gif);
}
#header span {
display: none;
}So wie dus haben willst (A-s) ersetzen könnte mans so machen.
<h3 id="header"><span><em>A</<em></span>lso l<span><em>A</<em></span>ss es uns testen</h3>

/* css */
#header span {
width: Xpx;
height: Xpx;
background-image: url(dein_A.png);
}

#header span em {
display: none;
}Wenn du dynamisch Inhalte ändern willst, bräuchtest du iirc CSS3 was noch kaum unterstützt wird.
dadie
04.12.2004, 12:49
Wenn du dynamisch Inhalte ändern willst, bräuchtest du iirc CSS3 was noch kaum unterstützt wird.

Damn -_-'

Warum will ich immer Dringe die kein/wennige Browser unterstützt ?

Naja es soll ja Dynamisch sein dieses ganze span würde den Endverbraucher des Templetes nur verunsichern :(

Naja werde ne Neue Lösung suchen THX aufjeden fall
Dingsi
04.12.2004, 13:33
Naja es soll ja Dynamisch sein dieses ganze span würde den Endverbraucher des Templetes nur verunsichern :(

Naja werde ne Neue Lösung suchen THX aufjeden fallMan könnte ein Script über den Text laufen lassen, der die A-s ersetzt.
dadie
04.12.2004, 13:45
Man könnte ein Script über den Text laufen lassen, der die A-s ersetzt.

Ja nur mit welcher Sprache ?

Das Temp soll ohne PHP auskommen also es soll überall laufen auf jeden Server der HTML erlaubt

Und ne Java lösung fällt mir nett ein
dadie
05.12.2004, 15:09
Hi ,

Sorry 4 Doppel Post aber weiss jemand den Javascript befehl der das selbe macht wie der PHP befehl ereg_replace ?
dead_orc
05.12.2004, 15:30
<script type="text/javascript">
var bla = "blub";
var test = bla.replace(/b/, "B");
document.write(test);
</script>

Ausgegeben würde damit "Blub" (das kleine "b" wurde durch ein großes ersetzt!)
Das /b/ kannst du AFAIK durch jeden regilären Ausdruck ersetzen!

PS: SelfHTML hilft!
dadie
05.12.2004, 16:08
<script type="text/javascript">
var bla = "blub";
var test = bla.replace(/b/, "B");
document.write(test);
</script>

Ausgegeben würde damit "Blub" (das kleine "b" wurde durch ein großes ersetzt!)
Das /b/ kannst du AFAIK durch jeden regilären Ausdruck ersetzen!

PS: SelfHTML hilft!


THX es klappt 1A

ps.Es ist sehr nervig einen Satz in Bilder Per JAVASCRIPT zu verwandeln macht es nicht nach !
dadie
05.12.2004, 16:56
Wieder sorry wegen Doppekpost aber ich habe ein Problem :(

Bisher ist mein Code so



<script type="text/javascript">
//Hier bitte den Namen der HP eingeben
//####################################
var hptitel01 = "ABCDEFGHIJKLMNOPRSTUVWXYZ - abcdefghijklmnopqrstuvwxyz";
//####################################


var hptitel02 = hptitel01.replace(/A/, "#");
var hptitel03 = hptitel02.replace(/B/, "§");
var hptitel04 = hptitel03.replace(/C/, "@");
var hptitel05 = hptitel04.replace(/D/, "´");
var hptitel06 = hptitel05.replace(/E/, "`");
var hptitel07 = hptitel06.replace(/F/, "}");
var hptitel08 = hptitel07.replace(/G/, "{");
var hptitel09 = hptitel08.replace(/H/, "€");
var hptitel10 = hptitel09.replace(/I/, "†");
var hptitel11 = hptitel10.replace(/J/, "‡");
var hptitel12 = hptitel11.replace(/K/, "Œ");
var hptitel13 = hptitel12.replace(/L/, "Ž");
var hptitel14 = hptitel13.replace(/M/, "‰");
var hptitel15 = hptitel14.replace(/N/, "£");
var hptitel16 = hptitel15.replace(/O/, "¤");
var hptitel17 = hptitel16.replace(/P/, "±");
var hptitel18 = hptitel17.replace(/Q/, "µ");
var hptitel19 = hptitel18.replace(/R/, "¶");
var hptitel20 = hptitel19.replace(/S/, "¾");
var hptitel21 = hptitel20.replace(/T/, "À");
var hptitel22 = hptitel21.replace(/U/, "Æ");
var hptitel23 = hptitel22.replace(/V/, "Ð");
var hptitel24 = hptitel23.replace(/W/, "Ø");
var hptitel25 = hptitel24.replace(/X/, "ç");
var hptitel24 = hptitel23.replace(/Y/, "þ");
var hptitel25 = hptitel24.replace(/Z/, "ƒ");
//###########################################
var hptitel26 = hptitel25.replace(/a/, "#");
var hptitel27 = hptitel26.replace(/b/, "§");
var hptitel28 = hptitel27.replace(/c/, "@");
var hptitel29 = hptitel28.replace(/d/, "´");
var hptitel30 = hptitel29.replace(/e/, "`");
var hptitel31 = hptitel30.replace(/f/, "}");
var hptitel32 = hptitel31.replace(/g/, "{");
var hptitel33 = hptitel32.replace(/h/, "€");
var hptitel34 = hptitel33.replace(/i/, "†");
var hptitel35 = hptitel34.replace(/j/, "‡");
var hptitel36 = hptitel35.replace(/k/, "Œ");
var hptitel37 = hptitel36.replace(/l/, "Ž");
var hptitel38 = hptitel37.replace(/m/, "‰");
var hptitel39 = hptitel38.replace(/n/, "£");
var hptitel40 = hptitel39.replace(/o/, "¤");
var hptitel41 = hptitel40.replace(/p/, "±");
var hptitel42 = hptitel41.replace(/q/, "µ");
var hptitel43 = hptitel42.replace(/r/, "¶");
var hptitel44 = hptitel43.replace(/s/, "¾");
var hptitel45 = hptitel44.replace(/t/, "À");
var hptitel46 = hptitel45.replace(/u/, "Æ");
var hptitel47 = hptitel46.replace(/v/, "Ð");
var hptitel48 = hptitel47.replace(/w/, "Ø");
var hptitel49 = hptitel48.replace(/x/, "ç");
var hptitel50 = hptitel49.replace(/y/, "þ");
var hptitel51 = hptitel50.replace(/z/, "ƒ");
var hptitel52 = hptitel51.replace(/ /, "&nbsp;");



var hptitel53 = hptitel52.replace(/#/, "<img src='./img/buchstaben/a-head.png' alt='A' title='A' >&nbsp;");
var hptitel54 = hptitel53.replace(/§/, "<img src='./img/buchstaben/b-head.png' alt='B' title='B' >&nbsp;");
var hptitel55 = hptitel54.replace(/@/, "<img src='./img/buchstaben/c-head.png' alt='C' title='C' >&nbsp;");
var hptitel56 = hptitel55.replace(/´/, "<img src='./img/buchstaben/d-head.png' alt='D' title='D' >&nbsp;");
var hptitel57 = hptitel56.replace(/`/, "<img src='./img/buchstaben/e-head.png' alt='E' title='E' >&nbsp;");
var hptitel58 = hptitel57.replace(/}/, "<img src='./img/buchstaben/f-head.png' alt='F' title='F' >&nbsp;");
var hptitel59 = hptitel58.replace(/{/, "<img src='./img/buchstaben/g-head.png' alt='G' title='G' >&nbsp;");
var hptitel60 = hptitel59.replace(/€/, "<img src='./img/buchstaben/h-head.png' alt='H' title='H' >&nbsp;");
var hptitel61 = hptitel60.replace(/†/, "<img src='./img/buchstaben/i-head.png' alt='I' title='I' >&nbsp;");
var hptitel62 = hptitel61.replace(/‡/, "<img src='./img/buchstaben/j-head.png' alt='J' title='J' >&nbsp;");
var hptitel63 = hptitel62.replace(/Œ/, "<img src='./img/buchstaben/k-head.png' alt='K' title='K' >&nbsp;");
var hptitel64 = hptitel63.replace(/Ž/, "<img src='./img/buchstaben/l-head.png' alt='L' title='L' >&nbsp;");
var hptitel65 = hptitel64.replace(/‰/, "<img src='./img/buchstaben/m-head.png' alt='M' title='M' >&nbsp;");
var hptitel66 = hptitel65.replace(/£/, "<img src='./img/buchstaben/n-head.png' alt='N' title='N' >&nbsp;");
var hptitel67 = hptitel66.replace(/¤/, "<img src='./img/buchstaben/o-head.png' alt='O' title='O' >&nbsp;");
var hptitel68 = hptitel67.replace(/±/, "<img src='./img/buchstaben/p-head.png' alt='P' title='P' >&nbsp;");
var hptitel69 = hptitel68.replace(/µ/, "<img src='./img/buchstaben/q-head.png' alt='Q' title='Q' >&nbsp;");
var hptitel70 = hptitel69.replace(/¶/, "<img src='./img/buchstaben/r-head.png' alt='R' title='R' >&nbsp;");
var hptitel71 = hptitel70.replace(/¾/, "<img src='./img/buchstaben/s-head.png' alt='S' title='S' >&nbsp;");
var hptitel72 = hptitel71.replace(/À/, "<img src='./img/buchstaben/t-head.png' alt='T' title='T' >&nbsp;");
var hptitel73 = hptitel72.replace(/Æ/, "<img src='./img/buchstaben/u-head.png' alt='U' title='U' >&nbsp;");
var hptitel74 = hptitel73.replace(/Ð/, "<img src='./img/buchstaben/v-head.png' alt='V' title='V' >&nbsp;");
var hptitel75 = hptitel74.replace(/Ø/, "<img src='./img/buchstaben/w-head.png' alt='W' title='W' >&nbsp;");
var hptitel76 = hptitel75.replace(/ç/, "<img src='./img/buchstaben/x-head.png' alt='X' title='X' >&nbsp;");
var hptitel77 = hptitel76.replace(/þ/, "<img src='./img/buchstaben/y-head.png' alt='Y' title='Y' >&nbsp;");
var hptitel78 = hptitel77.replace(/ƒ/, "<img src='./img/buchstaben/z-head.png' alt='Z' title='Z' >&nbsp;");


document.write(hptitel78);

</script>


1,Ja man muss die einzelnen Buchstaben durch Sonderzeichen ersätzen sonst klappt es einfach nett

2,Wenn der Titel der HP nun ABC ABC heisst werden nur das erste ABC umgewandelt das anderre ABC nicht.Warum ?

Man siht das gut hier auf der seite

http://dlcc.beta.piranho.de/css-style/
dead_orc
05.12.2004, 19:54
OMFG!!!!!!!
WTH soll das sein??? Willst du meinen Browser zum absturz bringen?????
Versuch mal diesen Code:

<script type="text/javascript">
var titel = "The Time";
for(i=0;i<titel.length;i++) {
part = titel.substr(i,1);
part = part.toLowerCase();
if(part != ' ') document.write('<img src="./img/buchstaben/'+part+'-head.png" alt="'+part+'" />');
else document.write(' ');
}
</script>

Ich glaube, der funktioniert ordentlich (auch wenn ich keine Buchstaben-Bildchen habe!)
dadie
05.12.2004, 20:01
OMFG!!!!!!!
WTH soll das sein??? Willst du meinen Browser zum absturz bringen?????
Versuch mal diesen Code:

<script type="text/javascript">
var titel = "The Time";
for(i=0;i<titel.length;i++) {
part = titel.substr(i,1);
part = part.toLowerCase();
if(part != ' ') document.write('<img src="./img/buchstaben/'+part+'-head.png" alt="'+part+'" />');
else document.write(' ');
}
</script>

Ich glaube, der funktioniert ordentlich (auch wenn ich keine Buchstaben-Bildchen habe!)


LOL naja Umbringen wollte ich Ihn nett aber habe mir schon gedacht das es ne Kürzere art gibt :D

Naja aber ist schon Witzig ich Code etwa 1 Stunden an diesem Endlosen Script du dann kommt so ein Script -_-

Und es Klappt 1A THX