Suche im Forum:
Suchen


Autor Nachricht
Beitrag02.11.2013 um 21:50 (UTC)    
Titel: [erledigt] Blinkender Text

hallo,

habe mich im Forum dusselig gesucht , aber nichts gefunden was funktioniert

http://www.homepage-baukasten.de/forum/search.php?mode=results

ich suche einen Code der blinkenden Text erzeugt, der hier:
<blink>TEXT</blink> funktioniert bei mir nicht und alles andere aus den Threads auch nicht

woran kann das liegen Rolling Eyes
______________
MfG aus der Schule

Zwei Dinge sind unendlich, das Universum und die menschliche Dummheit,
wobei ich mir beim Universum nicht ganz sicher bin. (Albert Einstein)


Zuletzt bearbeitet von schulzeit-in-leipzig am 04.11.2013, 06:02, insgesamt einmal bearbeitet
Beitrag02.11.2013 um 22:33 (UTC)    
Titel: Re: Blinkender Text

schulzeit-in-leipzig hat Folgendes geschrieben:
woran kann das liegen Rolling Eyes

Daran, dass das blink-Tag das wohl verhassteste aller HTML-Elemente ist.

Aus Firefox wurde es beispielsweise mit Version 23 wieder entfernt:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/blink
(siehe roter Kasten)

Auch die CSS Eigenschaft text-decoration: blink; funktioniert in den meisten Browser nicht (mehr).

Generell sollte man auf blinkende Elemente verzichten. Falls du deine Besucher aber unbedingt mit blinkendem Text quälen willst kannst du es mit JavaScript (visibility hidden und wieder visible im Wechsel) oder über eine CSS3 Animation erreichen.
______________
Mit mir chatten? Besuche uns auf CookieChat.de (keine Anmeldung nötig, einfach einen Spitznamen einegeben)


Zuletzt bearbeitet von freefunstuff am 02.11.2013, 23:34, insgesamt einmal bearbeitet
Beitrag03.11.2013 um 15:52 (UTC)    
Titel: Re: Blinkender Text

freefunstuff hat Folgendes geschrieben:
schulzeit-in-leipzig hat Folgendes geschrieben:
woran kann das liegen Rolling Eyes

Daran, dass das blink-Tag das wohl verhassteste aller HTML-Elemente ist.

Shocked oooooh

freefunstuff hat Folgendes geschrieben:
Falls du deine Besucher aber unbedingt mit blinkendem Text quälen willst kannst du es mit JavaScript (visibility hidden und wieder visible im Wechsel) oder über eine CSS3 Animation erreichen.

Very Happy ja will ich
Rolling Eyes hm... und wie würde dann der fertige Code aussehen - hättest du da was bitte Question Embarassed
______________
MfG aus der Schule

Zwei Dinge sind unendlich, das Universum und die menschliche Dummheit,
wobei ich mir beim Universum nicht ganz sicher bin. (Albert Einstein)
Beitrag03.11.2013 um 16:53 (UTC)    
Titel:

Da habe ich doch irgendwo ein Beispiel auf meinem Computer rumliegen.
Ich such mal kurz...

---nach 5 Minuten Suchen:

ALso ich habe jetzt mal auf meiner Festplatte geschaut und dort noch einen "weichen" Blinktext gefunden. Dieser blinkt nicht so hart an und aus sondern wird langsam ein und ausgeblendet. Davon bekommt man nicht so einen Augenkrebs, jedoch erziehlt man trodsdem damit die Aufmerksamkeit der Seitenbesucher.

Hier der Code:
Code:
<script type='text/javascript'>
<!--
var tindex = 0;
texte = new Array();

/* HIER DIE TEXTE ANGEBEN */
texte[tindex++] = "Das ist der Text NR. 1";
texte[tindex++] = "Und Hier kommt noch ein Text";
texte[tindex++] = "Dies Hier, der 3. Text ist auch der letzte.";


var textfarbe = "#ff0000";      //  textfarbe und hintergrundfarbe
var hintergrundfarbe = "#ffffff";      //  nur in diesem format angeben !
var textgroesse = "32";
var textfont = "serif";
var zeit = 20;

/* AB HIER NICHTS MEHR ÄNDERN */

var flag = true;
var textnr = 0;
var z = 0;

var hexzahl = new Array("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f");

function htod(pos1, pos2, hex)
{
for(x = 0; x < 16; x++)
{
if(hexzahl[x] == hex.substr(pos1, 1))
   break;
}
pos1 = x * 16;
for(x = 0; x < 16; x++)
{
if(hexzahl[x] == hex.substr(pos2, 1))
   break;
}
return(pos1 + x);
}

function einausblenden()
{
blenden = document.getElementById("text");
if(flag)
{
if((z += 2) > (maxdiff - 3))
{
flag = false;
rfakt *= -1;
gfakt *= -1;
bfakt *= -1;
}
}
else
{
if((z -= 2) < 3)
{
blenden.style.visibility = "hidden";
if((textnr++) > (tindex-2))
   textnr = 0;
flag = true;
rfakt *= -1;
gfakt *= -1;
bfakt *= -1;
}
}
hrot += rfakt * 2;
hgruen += gfakt * 2;
hblau += bfakt * 2;

var rhih = Math.round((hrot / 16) - 0.5);
var rhil = Math.round((hrot % 16) - 0.5);
var ghih = Math.round((hgruen / 16) - 0.5);
var ghil = Math.round((hgruen % 16) - 0.5);
var bhih = Math.round((hblau / 16) - 0.5);
var bhil = Math.round((hblau % 16) - 0.5);

blenden.innerHTML = texte[textnr];
blenden.style.color = "#"+hexzahl[rhih]+hexzahl[rhil]+hexzahl[ghih]+hexzahl[ghil]+hexzahl[bhih]+hexzahl[bhil];
blenden.style.background = hintergrundfarbe;
blenden.style.visibility = "visible";
setTimeout("einausblenden()", zeit);
}
textfarbe = textfarbe.toLowerCase();
hintergrundfarbe = hintergrundfarbe.toLowerCase();

var trot = htod(1 , 2, textfarbe);
var tgruen = htod(3, 4, textfarbe);
var tblau = htod(5, 6, textfarbe);

var hrot = htod(1 , 2, hintergrundfarbe);
var hgruen = htod(3, 4, hintergrundfarbe);
var hblau = htod(5, 6, hintergrundfarbe);

var rdiff = Math.abs(trot - hrot);
var gdiff = Math.abs(tgruen - hgruen);
var bdiff = Math.abs(tblau - hblau);
var maxdiff = Math.max(rdiff, gdiff, bdiff);
maxdiff++;

var rdiff = trot - hrot;
var gdiff = tgruen - hgruen;
var bdiff = tblau - hblau;

var rfakt = rdiff / maxdiff;
var gfakt = gdiff / maxdiff;
var bfakt = bdiff / maxdiff;

document.write('<div id="text" style="visibility:hidden;font-family:'+textfont+';font-size:'+textgroesse+'px;color:'+hintergrundfarbe+'">-</div>');
//-->
</script>
<br />



<script type="text/javascript">einausblenden();</script>

Passt das Script soweit? - bitte gebt mir Rückmeldung
______________
Alles über 3D-Druck | Heimsteuerung mit Rapberry PI | Kontakt - über mich
FAQ YOU!!! - Ich biete keinen Support über PN an!!! - bitte schreibt im Forum
Homepage-Tools: HTML-Grundkurs | Farbtabelle | Mi† Soиdεrzeichen schreiЬen
CSS-Tuturials: CSS-Grundkurs | Transparente Elemente | Farbverläufe | Boxschatten | CSS-Rahmen | Textschatten | Hintergrundbilder
Javascript-Tuturials
Beitrag03.11.2013 um 18:48 (UTC)    
Titel:

Code:
.blink {
    -webkit-animation: blink 1s steps(5, start) infinite;
    animation: blink 1s steps(5, start) infinite;
}

@-webkit-keyframes blink {
    to {
        visibility: hidden;
    }
}
@keyframes blink {
    to {
        visibility: hidden;
    }
}

(Ich habe es für webkit-Browser ergänzt.)

HTML
Code:
<span class="blink">hier dein text</span>

Alles, dem du die blink-Klasse zuweist wird in CSS3-fähigen Browsern blinken.

Wenn du es nicht blinken, sondern ein- und ausfaden lassen willst kannst du visibility: hidden; durch opacity: 0; ersetzen
______________
Mit mir chatten? Besuche uns auf CookieChat.de (keine Anmeldung nötig, einfach einen Spitznamen einegeben)


Zuletzt bearbeitet von freefunstuff am 03.11.2013, 19:49, insgesamt einmal bearbeitet
Beitrag03.11.2013 um 19:27 (UTC)    
Titel:

Danke euch beiden vielmals Razz

funktioniert beides


LG aus der Schule
______________
MfG aus der Schule

Zwei Dinge sind unendlich, das Universum und die menschliche Dummheit,
wobei ich mir beim Universum nicht ganz sicher bin. (Albert Einstein)
Beitrag03.11.2013 um 21:04 (UTC)    
Titel:

@schulzeit-in-leipzig: Wenn das so ist, dann editiere doch den Titel im ersten Beitrag dieses Threads und setze ein [erledigt] davor, damit er von einem Moderator gesperrt werden kann.
______________
Alles über 3D-Druck | Heimsteuerung mit Rapberry PI | Kontakt - über mich
FAQ YOU!!! - Ich biete keinen Support über PN an!!! - bitte schreibt im Forum
Homepage-Tools: HTML-Grundkurs | Farbtabelle | Mi† Soиdεrzeichen schreiЬen
CSS-Tuturials: CSS-Grundkurs | Transparente Elemente | Farbverläufe | Boxschatten | CSS-Rahmen | Textschatten | Hintergrundbilder
Javascript-Tuturials
Beitrag04.11.2013 um 05:03 (UTC)    
Titel:

schreibmalwas hat Folgendes geschrieben:
@schulzeit-in-leipzig: Wenn das so ist, dann editiere doch den Titel im ersten Beitrag dieses Threads und setze ein [erledigt] davor, damit er von einem Moderator gesperrt werden kann.


ja sorry - hätte ich gleich machen können - danke Wink
______________
MfG aus der Schule

Zwei Dinge sind unendlich, das Universum und die menschliche Dummheit,
wobei ich mir beim Universum nicht ganz sicher bin. (Albert Einstein)
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de