HTML5 banner en include code creëren

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Top Low-Code Developer Gezocht!

Bedrijfsomschrijving Unieke Kansen, Uitstekende Arbeidsvoorwaarden & Inspirerend Team Wij zijn een toonaangevende, internationale organisatie die de toekomst van technologie vormgeeft door het creëren van innovatieve en baanbrekende oplossingen. Ons succes is gebaseerd op een hecht en gepassioneerd team van professionals die altijd streven naar het overtreffen van verwachtingen. Als jij deel wilt uitmaken van een dynamische, vooruitstrevende en inspirerende werkomgeving, dan is dit de perfecte kans voor jou! Functieomschrijving Als Low-Code Developer ben je een cruciaal onderdeel van ons team. Je werkt samen met collega's uit verschillende disciplines om geavanceerde applicaties te ontwikkelen en te optimaliseren met behulp van Low-code

Bekijk vacature »

Ferdi R

Ferdi R

02/06/2016 17:53:26
Quote Anchor link
Chrome gaat flash niet meer ondersteunen en daarom wil ik een beetje met html5 banners experimenteren. Daarom de vraag hoe zouden jullie een html5 banner opzetten en includen, wat zal volgens jou het beste manier zijn.

Nu heb ik het volgende bedacht, integratie:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
        <div id="ad-div" data-adid="F-0001" data-pub="0001"></div>
        <script src="http://www.website.nl/banner/js/ad.js"></script>


ad.js
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
function maakad(adid){
    document.getElementById('ad-div').innerHTML = '<iframe src="http://www.website.nl/banner/html5/banner.php" data-adid="'+adid+'" id="ad-00"></iframe>';
}


banner.php
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<!DOCTYPE html>
<html lang="nl-NL">
<head>
    <meta charset="UTF-8" />

    <title>Banner</title>

    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="viewport" content="width=device-width, user-scalable=no" />
    
    <style>
    .banner         { position: relative; color: #FFFFFF; background: #21561a; overflow: hidden; }
    .banner h1      { position: absolute; font-weight: 300; top: -40px; right: 10px; font-size: 2em; z-index: 4; text-shadow: 0 0 6px #000000, 0 0 6px #000000; }
    </style>

</head>
<body>
    <div class="banner">
        <h1>ik ben een banner</h1>
    </div>
    
</body>
</html>
 
Er zijn nog geen reacties op dit bericht.



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.