suchen

Heim  >  Artikel  >  Web-Frontend  >  So implementieren Sie kreisförmige Werbebanner in Javascript

So implementieren Sie kreisförmige Werbebanner in Javascript

亚连
亚连Original
2018-06-21 11:54:531576Durchsuche

Dieser Artikel stellt hauptsächlich die Wirkung von Javascript zur Implementierung kreisförmiger Werbebanner vor. Er hat einen gewissen Referenzwert.

Das Beispiel dieses Artikels dient dazu, die Wirkung mit allen zu teilen Javascript zur Implementierung von zirkulärer Werbung. Der spezifische Inhalt lautet wie folgt:

HTML-Code: 

<!DOCTYPE html>
<html>
<head>
<title>Rotating Banner</title>
<script src="script07.js"></script>
<link rel="stylesheet" href="script01.css" rel="external nofollow" >
</head>
<body>
<p class="centered">
<img src="images/reading1.gif" id="adBanner" alt="Ad Banner">
</p>
</body>
</html>

js-Code: 

body {
background-color: white;
color: black;
font-size: 20px;
font-family: "Lucida Grande", Verdana,Arial, Helvetica, sans-serif;
}
h1, th {
font-family: Georgia, "Times New Roman",Times, serif;
}
h1 {
font-size: 28px;
}
table {
border-collapse: collapse;
}
th, td {
padding: 10px;
border: 2px #666 solid;
text-align: center;
width: 20%;
}
#free, .pickedBG {
background-color: #f66;
}
.winningBG {
background-image:url(images/redFlash.gif);
}

in der Schleife Fügen Sie einen Link zum Werbebanner hinzu: Ändern Sie den js-Code 

window.onload = rotate;
var thisAd = 0;
function rotate() {
var adImages = new Array("images/ reading1.gif","images/reading2. gif","images/reading3.gif");
thisAd++;
if (thisAd == adImages.length) {
thisAd = 0;
}
document.getElementById("adBanner").src = adImages[thisAd];
setTimeout(rotate, 3 * 1000);//设置时间,本每隔多长时间改变广告条中的GIF
}

Das Obige habe ich für alle zusammengestellt. Ich hoffe, es wird für alle hilfreich sein die Zukunft.

Verwandte Artikel:

So verwenden Sie die Position der Bildlaufleiste zur Beurteilung

So legen Sie Platzhalter-Eingabeaufforderungstext mithilfe des WeChat-Applets dynamisch fest

Informationen zur Verwendung von ES6/JavaScript (ausführliches Tutorial)

So crawlen Sie Website-Bilder in NodeJS

Das obige ist der detaillierte Inhalt vonSo implementieren Sie kreisförmige Werbebanner in Javascript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Über das Debugging-Tool vue-devtools in Vue (ausführliches Tutorial)Nächster Artikel：Über das Debugging-Tool vue-devtools in Vue (ausführliches Tutorial)

In Verbindung stehende Artikel

Mehr sehen