Avatar billede e-side.dk Nybegynder
29. april 2002 - 15:33 Der er 18 kommentarer og
1 løsning

Nyt banner format

http://nyheder.tv2.dk/ kører lige nu et helt nyt bannerformat. Det er et lille banner i venstre side, der zoom'er ud og dækker hele siden, hvorefter det zoom'er ind til oprindelig størrelse igen. Jeg har forsøgt at "efterligne" dette banner, men da mine kundskaber i JavaScript er meget begrænsede, er det ikke lykkedes.

Jeg håber der er nogen der kan hjælpe med en komplet kode. Altså noget kode, som er nemt at tilpasse, selvom man ikke kan JavaScript. Jeg er klar over at det er en stor opgave, men jeg håber I vil tage udfordringen op.

Nårh ja...banneret på TV2 vises kun en enkelt gang. Derefter smides der en cookie, så man ikke ser banneret hver gang siden hentes. Jeg vil dog helst have at banneret kommer hver gang.

Håber I kan hjælpe.
Avatar billede proboss Nybegynder
29. april 2002 - 15:42 #1
Højre klik gå ned på siden til du finder zoombanner kopir det og den js fil så har du det

der er mange der har været uden after deres menuer og der står ja tage den bare så det gøre der sikkert også her
Avatar billede e-side.dk Nybegynder
29. april 2002 - 16:04 #2
Det virker desværre ikke :-(

Hvis du an få det til at virke, vil jeg meget gerne se noget kode, og nogle instrukser i hvordan jeg tilpasser det.
Avatar billede proboss Nybegynder
29. april 2002 - 16:25 #3
jeg ville gøre som jeg har skrevet ovenfor og så leje med det til det var tilpasset

det gøre jeg ikke for 60 points sorry
Avatar billede e-side.dk Nybegynder
29. april 2002 - 16:34 #4
Det har jeg forsøgt i rigtig lang tid (hele dagen), men det virker ikke.

Jeg ved godt at mange har "genbrugt" TV2's menu (den er nem at hugge), men det behøver jo ikke gælde for dette banner.
Avatar billede cdc Novice
29. april 2002 - 17:31 #5
du skal have fadt i dette script, zoombanner.js
Avatar billede e-side.dk Nybegynder
29. april 2002 - 17:35 #6
Til / cdc,

Jeg er godt klar over at jeg skal have fat i zoombanner.js, og det har jeg også. Det er dog stadig ikke nok. Hvis du kan få det til at virke, må du meget gerne skrive koden her på siden.

Så er der jo også points at hente :-)

Glæder mig til at høre fra dig.
Avatar billede proboss Nybegynder
29. april 2002 - 19:37 #7
Hvor svært kan det være at hente den js fil højre klil på siden find url ogskriv den i din adresse linie så er den der
Avatar billede e-side.dk Nybegynder
29. april 2002 - 20:07 #8
Til proboss,

Det er skam ikke svært, men metoden virker ikke af den grund. Du kan jo prøve selv :-) Hvis du kan få det til at virke hører jeg gerne fra dig.
Avatar billede e-side.dk Nybegynder
29. april 2002 - 20:12 #9
Jeg har hævet point'ne til det dobbelte (120 points)!
Avatar billede proboss Nybegynder
29. april 2002 - 20:16 #10
jeg kan godt hive den js fil ned så det kan du også men jeg vil ikke gøre det, det må du selv jeg skal ikke ind i noget med Copyright eller noget i den still

jeg har sagt hvordan du gør det højre klik find zoombanner lige undr den ligger url til js file såd ved du selv resten
Avatar billede e-side.dk Nybegynder
29. april 2002 - 20:23 #11
Til proboss,

Som jeg har forsøgt at forklare en del gange, har jeg ingen problemer med at hente den omtalte js fil. Scriptet virker bare ikke når man blot henter det ned. Der skal gøres et eller andet ved det.
Avatar billede ras2000 Nybegynder
30. april 2002 - 15:35 #12
Prøv det her, det er hjemmelavet.
<html>
<head>
<script type="text/javascript">
var a = 0;
var b = 0;
function zoom() {
document.all.her.style.width = a;
document.all.her.style.height = b;
document.all.her.style.top = 400 - a;
setTimeout("zoomer()", 1);
}
function zoomer(){
if (a<400){
    a = a + 20;
    b = b + 20;
    zoom();
}
}
</script>
<body onload="zoom()">
pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder
pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder
<div id="her" style="position:absolute;top:100%;left:0;background-color:#ff0000;border-style:solid;border-width:2;border-color:#000000">
<span style="position:relative;top:4;left:95%;border-style:solid;border-width:2;border-color:#000000;cursor:hand" onclick="this.parentElement.style.display='none'">&nbsp;x&nbsp;</span>
her
</div>
</body>
</html>
Avatar billede ras2000 Nybegynder
30. april 2002 - 15:57 #13
Her er en lidt mere avanceret version, hvor banneret går helt til kanten.
<html>
<head>
<script type="text/javascript">
var a = 0;
var b = 0;
function zoom() {
    document.all.her.style.width = a;
    document.all.her.style.height = b;
    document.all.her.style.top = document.body.clientHeight - b;
    setTimeout("zoomer()", 1);
}
function zoomer(){
    var maxa = document.body.clientWidth - 20;
    var maxb = document.body.clientHeight - 20;
    videre = 0;
    if (a<maxa){
        a = a + 20;
        videre = 1;
    }
    if (b<maxb){
        b = b + 20;
        videre = 1;
    }
    if (videre == 1){
        zoom();
    }
    if (videre == 0){
        setTimeout("stopper()", 2000);
    }
}
function stopper(){
    document.all.her.style.display = 'none'
}
</script>
<body onload="setTimeout('zoom()',2000)">
pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder
pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder
<div id="her" style="position:absolute;top:100%;left:0;background-color:#ff0000;border-style:solid;border-width:2;border-color:#000000">
<span style="position:relative;top:4;left:95%;border-style:solid;border-width:2;border-color:#000000;cursor:hand" onclick="this.parentElement.style.display='none'">&nbsp;x&nbsp;</span>
her står al den tekst du vil vise frem.
</div>
</body>
</html>
Avatar billede e-side.dk Nybegynder
30. april 2002 - 17:21 #14
Til ras 2000,

Den er meget tæt på nu :-)

Reklamen skal dog også zoome ind igen. Desuden må du meget gerne skrive (med kommentarer), hvor jeg angiver x antal sekunder reklamen vises, hvor bred og høj reklamen skal være samt hvor den zoom'er ud fra. Håber du forstår hvad jeg mener.

Hvis du kan klare det er pointene dine!
Avatar billede ras2000 Nybegynder
01. maj 2002 - 09:52 #15
nu zoomer den også ned.
<html>
<head>
<script type="text/javascript">
var a = 0;
var b = 0;
var videre = 1;
function zoom() {
    document.all.her.style.width = a;
    document.all.her.style.height = b;
    document.all.her.style.top = document.body.clientHeight - b;
    if (videre == 1){
        setTimeout("zoomop()", 1);
    }
    if (videre == -1){
        setTimeout("zoomned()", 1);
    }
}
function zoomop(){
    var maxa = document.body.clientWidth - 20;
    var maxb = document.body.clientHeight - 20;
    videre = 0;
    if (a<maxa){
        a = a + 20;
        videre = 1;
    }
    if (b<maxb){
        b = b + 20;
        videre = 1;
    }
    if (videre == 1){
        zoom();
    }
    if (videre == 0){
        setTimeout("zoomned()", 2000);
    }
}
function zoomned(){
    videre = 0;
    if (a>20){
        a = a - 20;
        videre = -1;
    }
    if (b>20){
        b = b - 20;
        videre = -1;
    }
    if (videre == -1){
        zoom();
    }
    if (videre == 0){
        stopper();
    }
}
function stopper(){
    document.all.her.style.display = 'none'
}
</script>
<body onload="setTimeout('zoom()',2000)">
pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder
pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder pladder
<div id="her" style="position:absolute;top:100%;left:0;background-color:#ff0000;border-style:solid;border-width:2;border-color:#000000">
<span style="position:relative;top:4;left:95%;border-style:solid;border-width:2;border-color:#000000;cursor:hand" onclick="this.parentElement.style.display='none'">&nbsp;x&nbsp;</span>
her står al den tekst du vil vise frem.
</div>
</body>
</html>
Du styrer tiden i de to linier der hedder

<body onload="setTimeout('zoom()',2000)"> og
setTimeout("zoomned()", 2000);

den første styrer hvor lang tid der går før den popper op, den anden styrer hvor lang tid der går før den popper ned igen.
Avatar billede ras2000 Nybegynder
01. maj 2002 - 09:57 #16
Bredden og højden angives med de to variable maxa og maxb, de er sat til document.body.clientHeight/Width - 20, det vil sige næsten hele skærmen. Den kan du selvfølgelig bare sætte til et tal i stedet. Hvis du vil ændre hvor den starter fra, er det straks lidt mere vanskeligt. Der er det nemmere at du giver mig et eksempel på hvor du vil have den til at starte fra, så kan jeg vise dig det.
Avatar billede e-side.dk Nybegynder
02. maj 2002 - 21:15 #17
Forestil dig en side ligesom http://nyheder.tv2.dk
En side der er bygget op med tabeller, er menu i venstre side osv. Jeg vil gerne have den til at starte i en sådan venstre menu.

Håber det er tilstrækkeligt til at hjælpe dig videre. Jeg kan ikke give dig adressen på den eksakte side, det den endnu er fortrolig.
Avatar billede ras2000 Nybegynder
06. maj 2002 - 09:46 #18
Kan du ikke bare arbejde videre med det jeg har lavet? Eller lægge koden ind til den side du har nu?
Avatar billede ras2000 Nybegynder
11. juli 2002 - 10:01 #19
Her er koden fra webbyen, så kan du jo sammenligne lidt.

                    <script language="JavaScript1.2">
                        a = eval((document.body.clientWidth-760)/2)+135;
                        document.write ('<DIV ID=scrolldownbanner STYLE="top:-154px;left:'+a+'px;clip:rect(250px auto auto auto);position:absolute; width:490px; height:250px;">');
                    </script>
                                       
                    <a href="../moduler/banner.asp?Banner=Move&amp;ID=208" target="_blank"><img src="../billed.asp?Banner=208" border="0" width="490" height="250" alt="Banner"></a></a><br><a onClick="scrollBannerDown();" HREF="#"><img SRC="../images/trans.gif" HEIGHT="1" WIDTH="427" border="0"><img BORDER="0" SRC="../Images/Scrolldown_annonce.gif" border="0" WIDTH="62" HEIGHT="14"></a></div>

                    <script LANGUAGE="Javascript">
                        yspan = 250;
                        function scrollBannerDown()
                        {
                            if(yspan > 0)
                            {
                                yspan = yspan - 35;
                                if(yspan <= 0)
                                {
                                    yspan = 0;
                                    document.getElementById('scrolldownbanner').style.top = 97
                                };
                                                       
                                document.getElementById('scrolldownbanner').style.clip = 'rect(' + yspan + ' auto auto auto)';
                                if(yspan > 0)
                                {
                                    document.getElementById('scrolldownbanner').style.top = parseInt(document.getElementById('scrolldownbanner').style.top)+35;
                                };
                                setTimeout("scrollBannerDown()",100);
                            };
                            else
                            {   
                                setTimeout("scrollBannerUp()",3000);
                            };
                        };
                                                   
                        function scrollBannerUp()
                        {
                            if(yspan < 250)
                            {
                                yspan = yspan + 35 ;
                                if(yspan >= 250)
                                {
                                    yspan = 250;
                                    document.getElementById('scrolldownbanner').style.top = -154};
                                    document.getElementById('scrolldownbanner').style.clip = 'rect(' + yspan + ' auto auto auto)';
                                    if(yspan < 250)
                                    {
                                        document.getElementById('scrolldownbanner').style.top = parseInt(document.getElementById('scrolldownbanner').style.top)-35;
                                    };
                                    setTimeout("scrollBannerUp()",50)
                                };
                            else
                            {
                                mayclick = 1;
                            };
                        };
                    </script><SCRIPT LANGUAGE="Javascript">    document.onload = setTimeout("scrollBannerDown()",2500);</SCRIPT>
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester