"Randomize your forum banner" not displaying banner in correct position

Go down

In progress "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on February 20th 2018, 6:35 am

https://help.forumotion.com/t138806-randomize-your-forum-banner

I am using the above tutorial on ModernBB. The theme I am using is http://demo.nicetheme.com/forum?theme_id=213853

Using the tutorial makes my banners go to the right of the page, all messed up.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by pedxz on February 20th 2018, 9:02 am

Hey,
Change your code to
Code:
var banner = new Array();
 
banner[0]='http://i38.servimg.com/u/f38/18/21/60/73/b010.png';
banner[1]='https://i62.servimg.com/u/f62/19/61/71/04/banner16.jpg';
banner[2]='http://i38.servimg.com/u/f38/18/21/60/73/b110.png';
banner[3]='http://i38.servimg.com/u/f38/18/21/60/73/b210.png';
banner[4]='https://i62.servimg.com/u/f62/19/61/71/04/banner18.jpg';
banner[5]='http://i38.servimg.com/u/f38/18/21/60/73/b310.png';
 
document.getElementById('logo').firstChild.src= banner[Math.floor(Math.random()*banner.length)]; setInterval("document.getElementById('logo').firstChild.src= banner[Math.floor(Math.random()*banner.length)];",3000);

Thanks,
avatar
pedxz
Forumember

Male Posts : 100
Reputation : 20
Language : português

http://ajuda.forumeiros.com/u62843

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on February 20th 2018, 9:23 am

pedxz wrote:Hey,
Change your code to
Code:
var banner = new Array();
 
banner[0]='http://i38.servimg.com/u/f38/18/21/60/73/b010.png';
banner[1]='https://i62.servimg.com/u/f62/19/61/71/04/banner16.jpg';
banner[2]='http://i38.servimg.com/u/f38/18/21/60/73/b110.png';
banner[3]='http://i38.servimg.com/u/f38/18/21/60/73/b210.png';
banner[4]='https://i62.servimg.com/u/f62/19/61/71/04/banner18.jpg';
banner[5]='http://i38.servimg.com/u/f38/18/21/60/73/b310.png';
 
document.getElementById('logo').firstChild.src= banner[Math.floor(Math.random()*banner.length)]; setInterval("document.getElementById('logo').firstChild.src= banner[Math.floor(Math.random()*banner.length)];",3000);

Thanks,

I have two banners in rotation, this doesn't seem to work at all.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on February 22nd 2018, 1:02 am

Bump.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by pedxz on February 22nd 2018, 7:59 am

change to:
Code:
(function() {
  var BannerRotator = {
    images : [
      'http://i21.servimg.com/u/f21/18/21/60/73/free10.png',
      'http://i21.servimg.com/u/f21/18/21/60/73/logo10.png'
    ],

    start_delay : 5000,
    duration : 5000,
    height : 'auto',

    fade_image : true,
    fade_speed : 1200,
    
    keep_initial : true,
    remember_position : true,
    preload : true,

    // technical data below
    index : -1,
    logo : null,
    
    // increment the index and display the next image in rotation after a small delay
    next : function(ms) {
      if (ms === undefined) ms = FA.BannerRotator.duration;

      window.setTimeout(function() {
        if (++FA.BannerRotator.index >= FA.BannerRotator.images.length) FA.BannerRotator.index = 0; // reset index when it exceeds "images" length
        if (FA.BannerRotator.remember_position) my_setcookie('fa_banner_index', FA.BannerRotator.index); // remember the last banner shown
        
        // fade banner in and out
        if (FA.BannerRotator.fade_image) {
          $(FA.BannerRotator.logo).fadeOut(FA.BannerRotator.fade_speed, function() {
            FA.BannerRotator.logo.src = FA.BannerRotator.images[FA.BannerRotator.index]; // set next banner
            $(this).fadeIn(FA.BannerRotator.fade_speed, FA.BannerRotator.next); // fade it in
          });
        }

        // default rotation
        else {
          FA.BannerRotator.logo.src = FA.BannerRotator.images[FA.BannerRotator.index];
          FA.BannerRotator.next();
        }
      }, ms);
    },
    
    // initial start up to get the correct logo node and setup some other settings
    init : function() {
      var logo = document.getElementById('i_logo') || document.getElementById('logo') || document.getElementById('pun-logo'),
          index = my_getcookie('fa_banner_index');
          
      if (logo) {
        FA.BannerRotator.logo = logo.tagName == 'IMG' ? logo : logo.firstChild;
        FA.BannerRotator.logo.style.height = FA.BannerRotator.height;
        
        if (FA.BannerRotator.keep_initial) FA.BannerRotator.images[FA.BannerRotator.images.length] = FA.BannerRotator.logo.src;
        if (FA.BannerRotator.remember_position && index) {
          FA.BannerRotator.index = +index;
          FA.BannerRotator.logo.src = FA.BannerRotator.images[FA.BannerRotator.index] || FA.BannerRotator.images[0];
        }
        
        FA.BannerRotator.next(FA.BannerRotator.start_delay);
      } else if (window.console && window.console.warn) {
        console.warn('Your forum version is not optimized for this plugin');
      }
    }
  };
  
  if (!window.FA) FA = {};
  if (!FA.BannerRotator) {
    FA.BannerRotator = BannerRotator;
    
    if (FA.BannerRotator.preload) {
      for (var i = 0, j = FA.BannerRotator.images.length, img; i < j; i++) {
        img = document.createElement('IMG');
        img.src = FA.BannerRotator.images[i];
      }
    }
    
    $(FA.BannerRotator.init);
  }
}());
by @Ange Tuteur
avatar
pedxz
Forumember

Male Posts : 100
Reputation : 20
Language : português

http://ajuda.forumeiros.com/u62843

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on February 22nd 2018, 8:45 am

Hmm, that seems to do a banner slideshow. Is it possible for the banner to change randomly upon refreshing the forum only?

Thanks again.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on February 23rd 2018, 12:01 pm

Bump.

My forum banner size is 2560x605. I have three of them that I would like in rotation. The tutorial works in the OP, but they're off centred and all to the right of the page.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on February 25th 2018, 1:40 am

Bump.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on February 26th 2018, 5:35 am

Hardcore Gamer wrote:My forum banner size is 2560x605. I have three of them that I would like in rotation. The tutorial works in the OP, but they're off centred and all to the right of the page.

Bump.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on February 27th 2018, 7:42 am

Bump.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by mpelmmc on February 27th 2018, 2:28 pm

Hello @Hardcore Gamer

Please go:
ACP(Admin Control Panel) > Modules > HTML & JAVASCRIPT > Javascript codes management > Create a new Javascript
  • Title: whichever you want
  • Position: All the pages
  • Javascript code:
    Code:
    $(function(){   
      var banner = new Array();
     
    //########################## EDITABLE ZONE ##################################
      var segundosDesfile = 5; //The seconds it takes to the banner to change to the following banner
      var random = false; //Change to -true- if you want that the banners change be automatic
      var speedTransition = "slow"; //You can change to -fast- the transition effect
     
      banner[0] = "URL_BANNER_1";
      banner[1] = "URL_BANNER_2";
      //You can add more...
    //########################## END EDITABLE ZONE #############################
     
      var i_act = 0;
      var sel = "img#i_logo, a#logo img, a#pun-logo img";
      $(sel).attr("src", banner[random ? Math.floor(Math.random() * banner.length) : i_act]);
      setInterval(function() { 
          $(sel).fadeOut(speedTransition,function(){
            $(sel).load(function(){
                $(sel).fadeIn();
            });
            $(sel).attr("src", banner[random ? Math.floor(Math.random() * banner.length) : ++i_act]);
          }); 
          if(!random && i_act == banner.length-1) i_act = -1;
      }, segundosDesfile * 1000); 
    });

Please let me know if this works for you or if you have any doubt so we can solve it Smile

Greetings.
avatar
mpelmmc
Helper
Helper

Male Posts : 523
Reputation : 70
Language : Spanish and English
Location : Spain

http://asistencia.foroactivo.com/forum

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on February 28th 2018, 1:38 am

@mpelmmc Hi there, the header seems to be way off still. I will send you a screenshot and my forum link through PM.

EDIT: I'd also like it if the banner changes when refreshing the page, and not a slideshow.

Thanks for your help.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by mpelmmc on February 28th 2018, 8:00 pm

Hello,

Please install the code I gave you in your forum in order to try to make it fit into your forum. I don't see it installed and therefore I cannot adjust it via CSS.

Also, I'd be useful if you could explain or provide screenshots about in what part you want of the header to be, this way we would give you a faster answer Wink.

Greetings.
avatar
mpelmmc
Helper
Helper

Male Posts : 523
Reputation : 70
Language : Spanish and English
Location : Spain

http://asistencia.foroactivo.com/forum

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on February 28th 2018, 10:57 pm

Hmm, I can send you a screenshot of what it is meant to look like through DM. I can't really keep the code up for too long as it ruins the whole forum and members will start to ask what's happening/it will look unprofessional.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by mpelmmc on February 28th 2018, 11:19 pm

Okay, I see what you mean.

I'm afraid I can't help with this because the way you want to edit the banner is meant to through a more advanced CSS and javascript knowledge that's really beyond me, so I think I can't help you any further than I did.

I'm sorry.
avatar
mpelmmc
Helper
Helper

Male Posts : 523
Reputation : 70
Language : Spanish and English
Location : Spain

http://asistencia.foroactivo.com/forum

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on February 28th 2018, 11:23 pm

https://help.forumotion.com/t138806-randomize-your-forum-banner

This code pretty much works, but the header just isn't aligned and centred properly in the middle.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by SLGray on March 1st 2018, 12:59 am

Are the banners all the same size and sized correctly for the area of the forum?


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.

avatar
SLGray
Administrator
Administrator

Male Posts : 43469
Reputation : 3086
Language : English
Location : United States

http://fmthemesdesignteam.forumotion.com/

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on March 1st 2018, 1:11 am

SLGray wrote:Are the banners all the same size and sized correctly for the area of the forum?

All the banners are 2560x605, yes, all the same size.


Last edited by Hardcore Gamer on March 19th 2018, 2:31 am; edited 1 time in total

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on March 2nd 2018, 7:35 am

I am starting to think maybe this code works better in templates? Is that possible, would that be a better way?

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on March 4th 2018, 6:21 am

Bump.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on March 5th 2018, 10:28 am

Another bump.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on March 7th 2018, 11:25 am

Bump.

I'm sure someone with the knowledge will see this one day and will be willing to help. Thanks.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on March 9th 2018, 4:58 am

Bump.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on March 16th 2018, 9:28 am

Hardcore Gamer wrote:Bump.

I'm sure someone with the knowledge will see this one day and will be willing to help. Thanks.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on March 18th 2018, 3:32 am

Hardcore Gamer wrote:Bump.

I'm sure someone with the knowledge will see this one day and will be willing to help. Thanks.

This code really needs fixing for ModernBB. Sad

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by pedxz on March 18th 2018, 1:34 pm

Try:

Code:
$(function() {
    var images = ['http://78.media.tumblr.com/6e79dd6dbfa7248e60a48ba9c36c4a7d/tumblr_nfvqpd8cgr1qzeylbo1_1280.gif', 'https://i.pinimg.com/originals/2e/35/95/2e359568d36c711612bdde426a28a51f.gif'];
    $('.headerbar').css({'background-image': 'url(' + images[Math.floor(Math.random() * images.length)] + ')'});
  });
avatar
pedxz
Forumember

Male Posts : 100
Reputation : 20
Language : português

http://ajuda.forumeiros.com/u62843

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on March 19th 2018, 2:42 am

WOW! That code actually works. I can't believe it. Thank you.

The only issue I find is that upon refreshing, sometimes the transition between banners is jarring and not instant. I'm not sure if it's possible to fix that? Like, sometimes when I hit the refresh button, the banner doesn't change to a new one...

Seriously, thank you again.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

In progress Re: "Randomize your forum banner" not displaying banner in correct position

Post by Hardcore Gamer on March 21st 2018, 9:26 am

This is pretty much solved, honestly. The code works fine.

I think one of the staff members should update the tips & tricks thread and use the above code for ModernBB.

Hardcore Gamer
Forumember

Male Posts : 522
Reputation : 4
Language : English

Back to top Go down

Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum