nicht angemeldet
nichtsnütziger Link
0 BBCode-Buttons
0
nichtsnütziger Link
Ich suche einen Link der nichts tut! Ich habe nemlich ein Problem mit ein bisschen CSS:
Ich möchte einen Editor für BB-Code schreiben und da hab ich die Button mit CSS gestaltet, oder besser: es versucht! Denn es werden nur die CSS Angaben benutzt wenn in href etwas steht!
Zur veranschaulichung:
CSS code:
#####Beginn#####
/* Edit Links */
.edit:link
{
border:1px solid #DDDDDD;
margin:2px;
}
.edit:visited
{
border:1px solid #DDDDDD;
margin:2px;
}
.edit:hover
{
border:1px solid #0000DD;
margin:2px;
}
.edit:active
{
border:1px solid #DDDDDD;
margin:2px;
}
#####Ende#####
HTMLcode:
#####Start#####
html>
<head>
<title>BBCode Editor</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<form name="formular" action="">
<script type="text/javascript">
<!--
function insert(aTag, eTag) {
var input = document.forms['formular'].elements['eingabe'];
input.focus();
/* für Internet Explorer */
if(typeof document.selection != 'undefined') {
/* Einfügen des Formatierungscodes */
var range = document.selection.createRange();
var insText = range.text;
range.text = aTag + insText + eTag;
/* Anpassen der Cursorposition */
range = document.selection.createRange();
if (insText.length == 0) {
range.move('character', -eTag.length);
} else {
range.moveStart('character', aTag.length + insText.length + eTag.length);
}
range.select();
}
/* für neuere auf Gecko basierende Browser */
else if(typeof input.selectionStart != 'undefined')
{
/* Einfügen des Formatierungscodes */
var start = input.selectionStart;
var end = input.selectionEnd;
var insText = input.value.substring(start, end);
input.value = input.value.substr(0, start) + aTag + insText + eTag + input.value.substr(end);
/* Anpassen der Cursorposition */
var pos;
if (insText.length == 0) {
pos = start + aTag.length;
} else {
pos = start + aTag.length + insText.length + eTag.length;
}
input.selectionStart = pos;
input.selectionEnd = pos;
}
/* für die übrigen Browser */
else
{
/* Abfrage der Einfügeposition */
var pos;
var re = new RegExp('[1]{0,3}$');
while(!re.test(pos)) {
pos = prompt("Einfügen an Position (0.." + input.value.length + "):", "0");
}
if(pos > input.value.length) {
pos = input.value.length;
}
/* Einfügen des Formatierungscodes */
var insText = prompt("Bitte geben Sie den zu formatierenden Text ein:");
input.value = input.value.substr(0, pos) + aTag + insText + eTag + input.value.substr(pos);
}
}
//-->
</script>
<a href="index.php">Index</a>
<table border=0>
<tr><td></td><td><center><a onClick="insert('[b]', '[/b]')"><img alt="Fett" src=".\images\editor\b.png"></a>
<a class="edit" onClick="insert('[i]', '[/i]')"><img alt="Kursiv" src=".\images\editor\I.png"></a>
<a class="edit" onClick="insert('[size=1]', '[/size]')"><img alt="klein" src=".\images\editor\A1.png"></a>
<a class="edit" onClick="insert('[size=5]', '[/size]')"><img alt="mittelgroß" src=".\images\editor\A2.png"></a>
<a class="edit" onClick="insert('[size=9]', '[/size]')"><img alt="groß" src=".\images\editor\A3.png"></a><br>
<a class="edit" onClick="insert('[color=FF0000]', '[/color]')"><img class="edit" alt="rot" src=".\images\editor\rot.png"></a>
<a class="edit" onClick="insert('[color=00FF00]', '[/color]')"><img alt="grün" src=".\images\editor\gruen.png"></a>
<a class="edit" onClick="insert('[color=0000FF]', '[/color]')"><img alt="blau" src=".\images\editor\blau.png"></a>
<a class="edit" onClick="insert('[color=DDDDDD]', '[/color]')"><img alt="grau" src=".\images\editor\grau.png"></a>
</center></td><tr>
<tr>
<td></td><td><textarea name="eingabe" cols="60" rows="10">Ihre Nachricht</textarea></td></tr>
<tr><td></td><td><input type="button" value="Einfügen" onClick="insert('[link]', '[/link]')"></td></tr>
</table>
</form>
</body>
</html>
#####Ende#####
0-9 ↩︎
-
Ich möchte einen Editor für BB-Code schreiben und da hab ich die Button mit CSS gestaltet, oder besser: es versucht! Denn es werden nur die CSS Angaben benutzt wenn in href etwas steht!
Ja, das ist auch so korrekt, da Du Dich der Pseudoklassen für Links bedienst. Du solltest besser Klickbuttons verwenden und mit Hilfe geeigneter Eventhandler das Linkverhalten simulieren: onmouseover/onmouseout für den Hovereffekt und onclick für den Aufruf der JS-Funktion. Die Pseudoklasse :visited hat m.E. bei BBCode-Buttons keinen tieferen Sinn.
Siechfred
--
Hinter den Kulissen passiert viel mehr, als man denkt, aber meistens nicht das, was man denkt.-
Das Problem ist nur, dass ich nicht gerade viel Ahnung habe von js.
Die Funktion habe ich auch nur hier von selfhtml geklaut...Ahh Klickbuttons sind aber dennoch interressant!
-
-
Ich suche einen Link der nichts tut!
<a href="#">foobar</a>--
LG,
Snafu-
Ich suche einen Link der nichts tut!
<a href="#">foobar</a>
Nein, dieser Link tut sehr wohl etwas, denn er veranlasst ein Neuladen der aktuellen Seite. Siechfred -- Hinter den Kulissen passiert viel mehr, als man denkt, aber meistens nicht das, was man denkt.-
Nein, dieser Link tut sehr wohl etwas, denn er veranlasst ein Neuladen der aktuellen Seite.
Nein, tut er nicht.
<a href="">foo</a>
veranlasst ein Neuladen.
<a href="#hier_kann_auch_was_stehen">foo</a>
tut dies nicht.
Wenn du hier im Forum auf "Aktuelle Nachrichten" klickst wird die Seite auch nicht neu geladen. Es wird nur zu den neuen Nachrichten gesprungen weil das Ziel existiert.--
LG,
Snafu-
Nein, tut er nicht.
<a href="">foo</a>
veranlasst ein Neuladen.Ja, da hast Du Recht.
<a href="#hier_kann_auch_was_stehen">foo</a>
tut dies nicht.Ja, auch da hast Du Recht, allerdings wird zum genannten Anker bzw. zum Anfang der Seite gesprungen. Also ist der Link nicht funktionslos :)
Siechfred
--
Hinter den Kulissen passiert viel mehr, als man denkt, aber meistens nicht das, was man denkt.-
Hallo,
das interessiert mich jetzt auch mal.
<a href="#hier_kann_auch_was_stehen">foo</a>
tut dies nicht.Ja, auch da hast Du Recht, allerdings wird zum genannten Anker bzw. zum Anfang der Seite gesprungen. Also ist der Link nicht funktionslos :)
Ginge es denn, wenn man den Anker quasi auf sich selbst springen lässt?
also so in etwa:
<a name="foo" id="foo"></a><a href="#foo">foo</a>
Funktioniert zumindest im IE6, was ja aber nichts heißen muss ;)Gruß,
Adda
-
-
-
-