html knowhow

Pulsierendes Bild

Mit dem Befehl "#vier" bes

So sieht´s aus

Quellcode

<html>
<head>

<style>
#button{width:450px;height:450px;top:0;margin:50 auto;text-align:center;}
#heart img{position:absolute;left:70%;margin:0 auto;-webkit-transition: opacity 7s ease-in-out;-moz-transition: opacity 7s ease-in-out;-o-transition: opacity 7s ease-in-out;transition: opacity 7s ease-in-out;}
@keyframes heartFadeInOut {
0% { opacity:1; }
14% { opacity:1; }
28% { opacity:0; }
42% { opacity:0; }
70% { opacity:0; }}
#heart img.top {animation-name: heartFadeInOut;animation-timing-function: ease-in-out;animation-iteration-count: infinite;animation-duration: 1s; animation-direction: alternate;}
</style>
</head>

<body>
<a href="egbXAdar.apk" download>
<div id="heart" >
<img class="bottom" src="Bilder/APP.gif" width="100px" />
<img class="top" src="Bilder/APP.gif" width="110px" />
</div></a>
</body>
</html>

Pulsierendes Bild

Mit dem Befehl "#vier" bes

So sieht´s aus

Quellcode

<html>
<head>
<script type="text/javascript" src="https://www.kostenlose-javascripts.de/wp-content/themes/3clicks/js/respond/respond.src.js"></script>

<style>
Hier nichts.
</style>
</head>

<body>
<img loading="lazy" class=" size-full wp-image-795" alt="_melon.gif" src="../Bilder/Andie%20MacDowell.jpg" width="200" height="250" name="gross_klein" border="0" />
<script type='text/javascript'>/*
© Valentin Hammer
Originalversion auf http://www.supermario.homepage.eu
*/

// Hier die Einstellungen für die Animation vornehmen

var Geschwindigkeit = 200;
var Anzahl_der_Zooms = 5;
var Zoomen_in_Pixel = 5;

// Ab hier nichts mehr ändern

var Bilder_Zooms = new Array();
var wie_Zoomen = new Array();

function Bild_gross_klein()
{
if(document.images)
{
if(document.gross_klein)
{
if(document.gross_klein.length)
{
for(var i=0;i<document.gross_klein.length;i++)
Bildgroesse_aendern(document.gross_klein[i],i);
}
else
Bildgroesse_aendern(document.gross_klein,0);
}
window.setTimeout("Bild_gross_klein()",Geschwindigkeit);
}
}

function Bildgroesse_aendern(Bild,Index)
{
var Breite = Bild.width;
var Hoehe = Bild.height;

if((Breite>0)&&(Hoehe>0))
{
if(!Bilder_Zooms[Index])
Bilder_Zooms[Index] = 0;
if(!wie_Zoomen[Index])
wie_Zoomen[Index] = 0;

if(Bilder_Zooms[Index]>=Anzahl_der_Zooms)
{
if(wie_Zoomen[Index]==0)
wie_Zoomen[Index] = 1;
else
wie_Zoomen[Index] = 0;
Bilder_Zooms[Index] = 0;
}
Bilder_Zooms[Index]++;

if(wie_Zoomen[Index]==0)
{
Breite += Zoomen_in_Pixel;
Hoehe += Zoomen_in_Pixel;
}
else
{
Breite -= Zoomen_in_Pixel;
Hoehe -= Zoomen_in_Pixel;
}
Bild.width = Breite;
Bild.height = Hoehe;
}
}
function initbgk() {
window.setTimeout("Bild_gross_klein()",Geschwindigkeit);
}
initbgk();</script> </div>

</body>
</html>

Pulsierendes Bild

Mit dem Befehl "#vier" bes

So sieht´s aus

Quellcode

<html>
<head>
<link rel="stylesheet" href="../scripte/infinite.css">

<style>
.alertPulse-css { animation: alertPulse 2s ease-out; animation-iteration-count: infinite; opacity: 1; background: white; /* you need this to specify a color to pulse to */}
.banner {margin: 0rem;}
</style>
</head>

<body>
<div class="banner alertPulse-css"><img height="auto" src="../Bilder/W-MSGS.jpg" width="25%" /></div>
</body>
</html>

Kontakt Datenschutz Impressum