Refreshing an ad-banner in a div container

Question

Got a webpage which is used for voting on different pictures (voting-tool).

On the page there are 2 different ad-banners which are stored in div containers.

The ads themselves get loaded by a script which fills the divs with the ads. (just as regular).

Now my problem is that the ads should reload after 5 pictures are clicked or after an amount of time. The option of page reload is also not possible. If the page is refreshed the pictures start at picture 1 again, so its not very useful if the viewer already is at like picture 10.

How can we reload a script / a single div container on a page so that the page stays exactly the same and only the ads reload and show another banner?

Any help is really appreciated.

Note: I've already tried it with

document.getElementById("addBoxOne").innerHTML

It works fine for text or pictures but not for a script and with

document.write("")

While using the document.write the whole page gets overwritten and not only the div itself. and I cant figure out how to only rewrite / refresh the Adbox

edit: script of the ad-banner

<div class="superbanner">
This is the div where the ad-banner is in and which i want to reload

<script language="JavaScript">
    if (typeof (WLRCMD) == "undefined") {
        var WLRCMD = "";
    }
    if (typeof (adlink_randomnumber) == "undefined") {
        var adlink_randomnumber = Math.floor(Math.random() * 10000000000)
    }
    document
            .write('<scr'
                    + 'ipt language="JavaScript" src="http://ad.de.doubleclick.net/adj/oms.skol.de/localnews_bilder;oms=localnews_bilder;reg=;nielsen=3b;dcopt=ist'
                    + WLRCMD + ';sz=728x90;tile=1;ord='
                    + adlink_randomnumber + '?"><\/scr'+'ipt>');
</script>
<noscript>
    <a
        href="http://ad.de.doubleclick.net/jump/oms.skol.de/localnews_bilder;oms=localnews_bilder;nielsen=3b;sz=728x90;tile=1;ord=1734775579?"
        target="_blank"><img
        src="http://ad.de.doubleclick.net/ad/oms.skol.de/localnews_bilder;oms=localnews_bilder;nielsen=3b;sz=728x90;tile=1;ord=1734775579?"
        border="0" width="728" height="90"></a>
</noscript>
<div class="clear"></div>

Is it possible to post the code that you are working or atleast the link to the page or a JSFiddle demo? That would really help people to narrow down the issue faster. — Vamsi Krishna, Mar 21 '14 at 11:05
i dont have any real code yet. i got the script which loads the addbanner (i got the script from a addbanner seller) and i just added that to my code. i worked with the innerhtml. i wanted to use the addbanner script to overwrite the content in the box. but i cant add a script at ...innerhtml = SCRIPTHERE. i also used the document.write but i cant get it to write in the div only. it overwrites my whole page. so the page is empty and only the addbanner is loaded by the script — Ferdinand Fatal, Mar 21 '14 at 11:06
Depending on how the ads are injected, it may be impossible to do this whilst still serving counted impressions. Really is dependant on the ad serving script. — michaelward82, Mar 21 '14 at 11:21

score 0 · Accepted Answer · answered Mar 21 '14 at 13:16

0

Try using AJAX instead of Document.write. . doc.write will remove everything in the dom before adding new stuff..

 $.ajax({
   url: "http://ad.de.doubleclick.net/adj/oms.skol.de/localnews_bilder;oms=localnews_bilder;reg=;nielsen=3b;dcopt=ist",
   dataType: "script",
   cache: true,//This will decide whether to cache it or no so that it will not add the       timestamp along with the request
  success: function(){}//In the success handler you can write your code which uses resources from this js file ensuring the script has loaded successfully before using it
 });

answered Mar 21 '14 at 13:16

JF it

2,403
3
20
30

thank you for the tipp with the $.ajax. but so far i still didnt manage to get it working. i dont realy know what iam doing wrong. or maybe i just placed it wrong into my code. i just dont see where i did the mistake – Ferdinand Fatal Mar 31 '14 at 09:34
your using document .write and that'll remove everything from the page. show how you've tried $.ajax. – JF it Mar 31 '14 at 09:39
i changed the `document.write` to the the code you posted. but i didnt get it working. i also tried to use `$(document).ready(function(){ $('#button').click(function(){ $('#superbanner').load("script.js"); }); });` – Ferdinand Fatal Mar 31 '14 at 12:04
Have you seen this: http://stackoverflow.com/questions/3857874/how-to-dynamically-insert-a-script-tag-via-jquery-after-page-load `$.getScript("test.js", function(){ alert("Running test.js"); });` might work for you. – JF it Mar 31 '14 at 12:12
i just tried that. i made a script.js file with the code of the adloader. then i placed the code $.getScript("script.js", function(){ alert("Running scrtipt.js"); }); in a function refresh(){} and the button is but the alert isnt working. if i place an alert in first line of the function like alert("test"); it works – Ferdinand Fatal Apr 01 '14 at 07:33
1

thank you all for your help. im realy close to finish my work – Ferdinand Fatal Apr 03 '14 at 14:18
@user3445924 glad to hear it. – JF it Apr 03 '14 at 15:21

score -1 · Answer 2 · answered Mar 21 '14 at 13:21

<body class="white">
    <h1 class="black">3 seconds image.</h1>
</body>

.white {
    background-color:#FFFFFF;
    color:#000000;
}
.black {
    background-color:#000000;
    color:#FFFFFF;
}
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {    
    function changeColor(){
        if ($('body').hasClass('white')) {
            $('body').removeClass('white');
            $('body').addClass('black');
            $('h1').removeClass('black');
            $('h1').addClass('white');
        }
        else {
            $('body').removeClass('black');
            $('body').addClass('white');
            $('h1').removeClass('white');
            $('h1').addClass('black');
        }
    }
    setInterval(changeColor, 3000);
});
</script>

other. see here documentation

$(document).ready(function() {
  // Put all your code here
    setInterval(function() {
        //$("#content").load(location.href+" #content>*","");
        $("#content").load('image.png').fadeIn("slow")
    }, 5000);
});

// simple example using the concept of setInterval

$(document).ready(function(){
var g = $('.jumping');
function blink(){
  g.animate({ 'left':'50px' 
  }).animate({
     'left':'20px'
        },1000)
}
setInterval(blink,1500);
});

Refreshing an ad-banner in a div container

2 Answers2