Load a different banner each time it is displayed

Need some custom code changes to the phpBB core simple enough that you feel doesn't require an extension? Then post your request here so that community members can provide some assistance.

NOTE: NO OFFICIAL SUPPORT IS PROVIDED IN THIS SUB-FORUM
Forum rules
READ: phpBB.com Board-Wide Rules and Regulations

NOTE: NO OFFICIAL SUPPORT IS PROVIDED IN THIS SUB-FORUM
Post Reply
Harrison76
Registered User
Posts: 247
Joined: Wed Jul 12, 2017 7:25 am

Load a different banner each time it is displayed

Post by Harrison76 »

Hi everyone, i don't know if this is the right section, but i'm writing to you about an extension that is not supported anymore, but my question is not about that extension specifically but instead about the code that you can load in the options: it's more a question for php/html programmers i think

I refer to the code visible in this post, which works very well but I would like to make a couple of changes
viewtopic.php?p=14939371#p14939371

in practice I would like to be able to set in one of the two spaces, a system so that once you load the site you see banner a, and the other time banner b (always in the left pane) or even banner C.
Each space should contain more banners that are seen in rotation every time you load the site page, or change page. Do you know how you can modify this code to make it do that function? Thanks
Last edited by HiFiKabin on Fri May 07, 2021 3:39 pm, edited 1 time in total.
Reason: Moved to Custom Coding
User avatar
Folks
Registered User
Posts: 41
Joined: Fri May 01, 2020 9:11 am

Re: Load a different banner each time it is displayed

Post by Folks »

Hi. This is not on page refresh but you can set a time and it will refresh the images automatically:

demo link

HTML

Code: Select all

<a href="http://google.com" id="adLink1">
  <img src="https://picsum.photos/id/22/200/300" id="adBanner1" alt="banner demo1" width="200" height="300">
</a>
Pure JS

Code: Select all

var imgs1 = new Array('https://picsum.photos/id/22/200/300','https://picsum.photos/id/10/200/300','https://picsum.photos/id/30/200/300');
var lnks1 = new Array('http://google.com','http://facebook.com','http://www.twitter.com');
var alt1 = new Array('banner demo1','banner demo2','banner demo3');

var imgCt1 = 3; // pictures number
var currentAd1 = Math.floor(Math.random() * imgCt1);
console.log(currentAd1);
function cycle1() {
    currentAd1 = (currentAd1 + 1) % imgCt1;
    console.log(currentAd1);
var banner1 = document.getElementById('adBanner1');
var link1 = document.getElementById('adLink1');
banner1.src=imgs1[currentAd1]
banner1.alt=alt1[currentAd1]
document.getElementById('adLink1').href=lnks1[currentAd1]
}
cycle1();
window.setInterval(cycle1,5000);//set the time interval here
Post Reply

Return to “phpBB Custom Coding”