[RD]Random log-in image

[Misaka]

I'm looking for a code that would allow me to insert multiple images or 5 max into the log-in screen and display them at random.

example is below:**
http://i1130./m521/alucard589/randomimagecode.png

what it should look like:
http://i1130./m521/alucard589/exampleofanothersite.png

I searched thru every code even the master database looking for this or something close to it

so can I get some help?

website: Anime Manga More


old edit:
I do have my Ad-blocker to help with the loading of boards and other sites

*_{img tags removed as large image stretched the page}~ by « Last Edit: Today at 12:20am by ♫Sossity♪ »

editing old link for new

** note I won't/can't say the other site name is due to the TOS about 13+ boards

[Misaka]

bump

[Wormopolis]

where you have the "image here" in the rectangle box at the top is where the ad normally would be. I will leave this for a red name to advise you on your next option.

[Misaka]

Sept 11, 2012 19:33:17 GMT -8 Wormopolis said:

where you have the "image here" in the rectangle box at the top is where the ad normally would be. I will leave this for a red name to advise you on your next option.

I had my Ad-blocker activated at the time to help me load some videos that I was watching hulu isn't a truly great site to watch strike witches 2 on.

the Ad is still there I just marked the wrong section with an [image here] in MS paint

if it also helps clear my case I have Kaspersky anti-virus as my protector


so am I in trouble?


edit for link:
link is dead

[CheatAreZee]

Hi,

It's against the terms of service to use ad-blocking software. Please remove the thread from your forum at once. In order to keep ProBoards as a free service, the ads need to display so we can continue to provide the best free forum experience possible. If you enjoy the ProBoards service but do not like the ads, please support us by using the ad-free function found in your admin panel. You may want to have a read of this article here which outlines why you should not block ads for the sites you love, as well as clears up some misconceptions about advertisements on websites.

We do have a pretty strict ad policy for our advertisers to, btw. For example, we do not allow ads that flash frequently, play audio automatically, automatically expand the page, or ads that tailor to adult services. We use the same forum experience as you do every day (and for myself, at least 8 hours a day); trust me when I say that we don't like ads that are annoying either. If you do happen to see any of these ads when using the ProBoards service, you can use CTRL + ALT + R on your keyboard to report the problem ad to our ad team so they can get it removed from the rotation

[Misaka]

Sept 12, 2012 8:36:38 GMT -8 CheatAreZee said:

Hi,

It's against the terms of service to use ad-blocking software. Please remove the thread from your forum at once. In order to keep ProBoards as a free service, the ads need to display so we can continue to provide the best free forum experience possible. If you enjoy the ProBoards service but do not like the ads, please support us by using the ad-free function found in your admin panel. You may want to have a read of this article here which outlines why you should not block ads for the sites you love, as well as clears up some misconceptions about advertisements on websites.

We do have a pretty strict ad policy for our advertisers to, btw. For example, we do not allow ads that flash frequently, play audio automatically, automatically expand the page, or ads that tailor to adult services. We use the same forum experience as you do every day (and for myself, at least 8 hours a day); trust me when I say that we don't like ads that are annoying either. If you do happen to see any of these ads when using the ProBoards service, you can use CTRL + ALT + R on your keyboard to report the problem ad to our ad team so they can get it removed from the rotation

sorry about that

"topic removed"

but I was still wondering about the code that would allow me to use images next to the login page

but I am curious about that ad-blocker problem it's only on my home computer when I enter it elsewhere or from a different computer everything is the same and nothing is blocked didn't know that was a huge risk factor

sorry about the trouble

Edit:
After reading into that link I have to say that I truly didn't understand the Ads purpose until now before I thought it was to be annoying but now it seems its goal is to make free sites like Proboards able to do what they are doing now without having to force users to pay in order to use the site

[CheatAreZee]

It's not a problem, just wanted to bring it to your attention

Unfortunately for the regular login screen, though, I've personally never seen that done where a random image would display to the left of the login box. Since we have the ad-block issue settled, I'll move this back to the code requests and support area. Perhaps Wormo or another coder may be able to provide some input on how that could be done. You may want to re-create a screenshot that has the ad displaying in its spot at the top of your page just to avoid potential confusion so they know that you're just looking to add an image next to the regular login screen, and not replace the ad

[Misaka]

Sept 12, 2012 9:09:59 GMT -8 CheatAreZee said:

It's not a problem, just wanted to bring it to your attention

Unfortunately for the regular login screen, though, I've personally never seen that done where a random image would display to the left of the login box. Since we have the ad-block issue settled, I'll move this back to the code requests and support area. Perhaps Wormo or another coder may be able to provide some input on how that could be done. You may want to re-create a screenshot that has the ad displaying in its spot at the top of your page just to avoid potential confusion so they know that you're just looking to add an image next to the regular login screen, and not replace the ad

will do ;D

also sorry for the mix up

edit:
here is what I was thinking about

[Chris]

▶ Pulp: "English...do you speak it?"     ☑ Descriptive subject     ☑ Clear description of the problem ▶ Maguire: "Help me help you"     ☑ Link to an example of the problem or desired outcome     ☑ Forum link (if not already given in example link)     ☑ Have you cleared the way so I as a guest view the problem?     ☑ If not guest-viewable have you provided images of the problem?     ☐ Code Link (if applicable)     ☐ Browser and version ▶ Dragnet: "Just the facts, ma'am"     ☑ Brief history of what has been tried so far (if anything)     ☐ Members or groups affected

A small question of timing cycle, are you looking to have this image rotated on every page load or do you have some time frame in mind where an image will expire and a new one chosen?

Anyhow, here's a code to try

Main Header:

---

<!-- Random Login Form Image CSS -->
<style type="text/css" id="login_image">
form[name="loginform"] {padding-left:2px; background: url(http://proboards.com/images/blank.gif) no-repeat;}
</style>
<!-- Random Login Form Image Script -->
<script type="text/javascript">
<!--
(function(bg){
if(!document.loginform)return;
var src= unescape(document.cookie.match(/loginbanner=([^;]+)/)?RegExp.$1:bg[Math.random()*bg.length>>0]), img=document.createElement('img');
img.onload = function(){
var dT = new Date(); dT.setDate(dT.getDate()+1);
//document.cookie = "loginbanner="+escape(this.src)+";expires="+ dT.toGMTString()+";";
var ss = document.getElementById("login_image"); ss = ss.sheet||ss.styleSheet;
if(ss.insertRule)ss.insertRule('form[name="loginform"] {padding-left:'+this.width+'px;background: url('+this.src+') no-repeat;}',ss.cssRules.length);
else{
ss.addRule('form.ieloginform','padding-left:'+this.width+'px;');
ss.addRule('form.ieloginform','background: url('+this.src+') no-repeat;');
if(document.loginform)document.getElementsByName('loginform')[0].className += " ieloginform";
window.attachEvent("onload",function(){for(var a = 0;a<document.forms.length;a++){
if(document.forms[a].name=="loginform" && !/ieloginform/.test(document.forms[a].className))document.forms[a].className += " ieloginform";
}})
}
}
img.src=src;
})([
"http://www.proboards.com/resources/images/android-promo2.png",
"http://i197./aa250/WORMOPOLIS/banner1.jpg",
"http://i4./y150/CheatRZ/pleasedontsteal.png",
"http://img26.imageshack.us/img26/2706/firefoxp.png"
])
// -->
</script>

Notes:

---

• If you want a timed rotation then remove the comments ("//") from the beginning of the line that starts:
  //document.cookie = "loginbanner="
  It is currently set to a 24 hour cycle if you enable it. Left disabled it will choose one of the images randomly on each page load that has a form
  
• At the end of the code you'll see I grabbed 4 images from his page and inserted it in the code as an example of how it is done. Obviously you would put your own set of images which can be as many as you like, just make sure the last one has no comma since it has no need to separate itself from another image following it.
  
• Internet Exploder as you know has no attribute selector support in quirks so there will be a delay in that browser while the forms are hunted down and manually changed after the page finishes loading.
  
• If you do enable a timed cycle and decide to change the images, those new images will not start popping up until the next cycle.
  

[Misaka]

Sept 12, 2012 12:40:51 GMT -8 Chris said:

A small question of timing cycle, are you looking to have this image rotated on every page load or do you have some time frame in mind where an image will expire and a new one chosen?

Anyhow, here's a code to try

Main Header:

---

<!-- Random Login Form Image CSS -->
<style type="text/css">
form[name="loginform"] {padding-left:2px; background: url(http://proboards.com/images/blank.gif) no-repeat;}
</style>
<!-- Random Login Form Image Script -->
<script type="text/javascript">
<!--
(function(bg){
if(!document.loginform)return;
var src= unescape(document.cookie.match(/loginbanner=([^;]+)/)?RegExp.$1:bg[Math.random()*bg.length>>0]), img=document.createElement('img');
img.onload = function(){
var dT = new Date(); dT.setDate(dT.getDate()+1);
//document.cookie = "loginbanner="+escape(this.src)+";expires="+ dT.toGMTString()+";";
var ss = document.getElementById("login_image"); ss = ss.sheet||ss.styleSheet;
if(ss.insertRule)ss.insertRule('form[name="loginform"] {padding-left:'+this.width+'px;background: url('+this.src+') no-repeat;}',ss.cssRules.length);
else{
ss.addRule('form.ieloginform','padding-left:'+this.width+'px;');
ss.addRule('form.ieloginform','background: url('+this.src+') no-repeat;');
if(document.loginform)document.getElementsByName('loginform')[0].className += " ieloginform";
window.attachEvent("onload",function(){for(var a = 0;a<document.forms.length;a++){
if(document.forms[a].name=="loginform" && !/ieloginform/.test(document.forms[a].className))document.forms[a].className += " ieloginform";
}})
}
}
img.src=src;
})([
"http://www.proboards.com/resources/images/android-promo2.png",
"http://i197./aa250/WORMOPOLIS/banner1.jpg",
"http://i4./y150/CheatRZ/pleasedontsteal.png",
"http://img26.imageshack.us/img26/2706/firefoxp.png"
])
// -->
</script>

Notes:

---

• If you want a timed rotation then remove the comments ("//") from the beginning of the line that starts:
  //document.cookie = "loginbanner="
  It is currently set to a 24 hour cycle if you enable it. Left disabled it will choose one of the images randomly on each page load that has a form
  
• At the end of the code you'll see I grabbed 4 images from his page and inserted it in the code as an example of how it is done. Obviously you would put your own set of images which can be as many as you like, just make sure the last one has no comma since it has no need to separate itself from another image following it.
  
• Internet Exploder as you know has no attribute selector support in quirks so there will be a delay in that browser while the forms are hunted down and manually changed after the page finishes loading.
  
• If you do enable a timed cycle and decide to change the images, those new images will not start popping up until the next cycle.
  

now then the second one does that go into the footer or stay in the header with the first one?

also thank you ;D

[Chris]

Second part, is written to go in header as shown and will load images faster on Firefox, chrome, safari and opera. If placed in footer then it will slow down a bit for other browsers but speed up for Internet Explorer with a small change, your choice if you want to optimize for IE

[Misaka]

I'll keep it at the fast pace for the FF users.

thanks again

[Chris]

I forgot to add the ID to that style tag in the first part (e.g. id="login_image")

[Misaka]

Sept 13, 2012 7:34:20 GMT -8 Chris said:

I forgot to add the ID to that style tag in the first part (e.g. id="login_image")

that would explain why it wasn't working ;D

thank you
"was just to PM you about this "

[Chris]

After looking at the result it seems you'll also need a min-height propertyValue added as well to avoid cutting off images taller than the form. I however have to figure out how to accomplish that with IE as well without resorting to evil expressions...

Edit:
I see you also enabled the 24 hour cycle so if you want to see how all the banners look you'll either need to delete the cookie or add a subdomain to your forum url to get another random roll

example:
http://test1.animeandofftopic.proboards.com/
http://test2.animeandofftopic.proboards.com/
http://test3.animeandofftopic.proboards.com/
http://test4.animeandofftopic.proboards.com/
and so on...

This assumes you don't use IE since that browser leaks the cookies to the subdomains