Ersetzen von Text durch einen anderen Text bei Hover nur mit HTML

-3

Ich versuche den Text zu ersetzen, wenn jemand den Originaltext in einen neuen Text bewegt. Gibt es eine Möglichkeit, dies in reinem HTML ohne CSS überhaupt zu tun? Wie auch immer, unten sind meine Codes, die ich vor kurzem gearbeitet habe:Ersetzen von Text durch einen anderen Text bei Hover nur mit HTML

HTML-Code:

<a href="#" class="button"> 
    <span>Product Name</span> 
</a>

CSS-Code:

.buton:not(:hover):before { 
content: "Old Text"; 
} 
.btn_action_1 span:hover:before { 
content: "New Text"; 
}

ich das gleiche tun wollen, aber mit Nur HTML. ist es möglich? Bz ich habe mehrere verschiedene Elemente, so dass es viel einfacher für mich sein wird. Thx

Quelle

2016-08-21 intel

'Old TextNew Text' und '.button: nicht (: hover)> .hover, .button: hover> .default {display: none}' sollte funktionieren. –

Mit reinem HTML nicht möglich. –

Warum haben Sie die Frage mit CSS markiert, wenn Sie keine CSS-Antworten wünschen? Dies ist, wie bereits erwähnt, mit nur HTML unmöglich. Mit CSS * ist es möglich, * abhängig davon, woher der 'neue Text' kommt (wenn er schon auf der Seite ist, ist es vielleicht abhängig von der Struktur der Seite und der Elemente); Andernfalls - es ist von einem Server oder von Benutzerinteraktion erhalten - dann ist es wahrscheinlich ohne JavaScript nicht möglich. "Ich möchte [das] nur mit HTML machen ... also wird es mir viel einfacher. *" - Woher hast du die Idee, dass Webdesign "* einfach *" sein sollte? –

-1

.btn_action_1:before { 
 
    content: ""; 
 
} 
 

 
.btn_action_1:hover:before { 
 
    content: "View Details"; 
 
} 
 

 
.btn_action_1:hover span { 
 
    display: none; 
 
}

<a href="#" class="btn_action_1"> 
 
    <span>Product Name</span> 
 
    <i class="ico_arrow"></i> 
 
</a>

ist es das, was Sie wollen?

Quelle

2016-08-21 11:26:03 link2pk

Lesen Sie die Frage vor der Beantwortung bitte. –

Nein, das ist nicht möglich. Wenn Sie möchten, dass Ihre Site ohne Neuladen aktualisiert wird, müssen Sie CSS (für einfache visuelle Änderungen) oder JavaScript (für alles, was komplexer ist) verwenden.

Quelle

2016-08-21 11:41:00 jPlatte

<!DOCTYPE html> 
<html> 
<head> 
<style> 
a:hover { font-size:0;} 

a:hover:after { 
font-size: 18px; 
content: attr(data-hover); 
} 

</style> 
</head> 
<body> 
<a href="" data-hover="CLICK ME">HOVER </a> 
</body> 
</html>

Das ist das Beste, was ich tun konnte. Ich weiß nichts über die Verwendung von HTML, um den Hover-Effekt zu bekommen oder vielleicht lerne ich noch nicht. Danke.

Quelle

2016-08-21 13:04:40 Sazz

Ersetzen von Text durch einen anderen Text bei Hover nur mit HTML

Antwort

Verwandte Themen