The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Change Post background According to Group

+2
Ange Tuteur
Spyro Dragon™
6 posters

Page 2 of 3 Previous  1, 2, 3  Next

Go down

In progress Change Post background According to Group

Post by Spyro Dragon™ December 21st 2014, 12:27 pm

First topic message reminder :

You know how there is a way to change the background IMG of the post according to if your female or male. . . is there a way we can do this but according to group..

Like Group FireDragon - will have a fire picture for their post background
Group IceDragon - will have  a ice picture for their post background
 

etc.. etc..

possible?
Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down


In progress Re: Change Post background According to Group

Post by Spyro Dragon™ December 25th 2014, 3:11 pm

They both do the same thing.... but im not sure if I like it or not, I might acualy use this option if they want it full or scrolling like this LOL

but I still would like to the other one   fixed in all browsers...what angi had gave me fixed it on my screen but screwd it up on other browrsers...

Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by _Twisted_Mods_ December 25th 2014, 7:04 pm

{
min-height:100%;
min-width:100%
background-repeat: no-repeat;
}
_Twisted_Mods_
_Twisted_Mods_
Helper
Helper

Male Posts : 2108
Reputation : 336
Language : English
Location : Ms

http://liquidcode.forumotion.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Spyro Dragon™ December 26th 2014, 1:09 am

haha I like this one too but it just makes the big picture follow ...

I added it in css like this just  incase I might have put it in wrong
 .spyro-background{
  background: url(https://i.servimg.com/u/f39/16/87/57/90/lunapi11.gif) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  overflow: auto;
    min-height:100%;
min-width:100%;
background-repeat: no-repeat;
}
 


but yea that just makes it follow. which I like...I haven't tried a small picture with it  yet
Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Spyro Dragon™ December 26th 2014, 1:15 am

and its still screwd up on other browsers like chrome.. 
on chrome the picture repeats itself
Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by _Twisted_Mods_ December 26th 2014, 1:40 am

.spyro-background{
  background: url(https://i.servimg.com/u/f39/16/87/57/90/lunapi11.gif);
  background-size: 100% 100%;
    min-height:100%;
min-width:100%;
background-repeat: no-repeat;
}
_Twisted_Mods_
_Twisted_Mods_
Helper
Helper

Male Posts : 2108
Reputation : 336
Language : English
Location : Ms

http://liquidcode.forumotion.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Spyro Dragon™ December 26th 2014, 2:44 am

00FF00 - Change Post background According to Group - Page 2 Cynder15
Now it looks like this
Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by _Twisted_Mods_ December 26th 2014, 4:28 am

ok last try then i give up



Code:
.spyro-background {


background:url(http://i39.servimg.com/u/f39/16/87/57/90/lunapi11.gif);


filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(


 ï¿½ � � �src='http://i39.servimg.com/u/f39/16/87/57/90/lunapi11.gif',


 ï¿½ � � �sizingMethod='scale');


-webkit-background-size: cover;


-moz-background-size: cover;


-o-background-size: cover;


background-size: cover;


background-position: left top;


background-repeat: no-repeat;


}


Last edited by _Twisted_Mods_ on December 26th 2014, 8:21 am; edited 1 time in total
_Twisted_Mods_
_Twisted_Mods_
Helper
Helper

Male Posts : 2108
Reputation : 336
Language : English
Location : Ms

http://liquidcode.forumotion.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by SLGray December 26th 2014, 4:47 am

Please when you post code use tbe code tags.


00FF00 - Change Post background According to Group - Page 2 Slgray10

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

Male Posts : 51463
Reputation : 3519
Language : English
Location : United States

https://forumsclub.com/gc/128-link-directory/

Back to top Go down

In progress Re: Change Post background According to Group

Post by _Twisted_Mods_ December 26th 2014, 8:20 am

sorry i don't mean to sometimes i just forget
_Twisted_Mods_
_Twisted_Mods_
Helper
Helper

Male Posts : 2108
Reputation : 336
Language : English
Location : Ms

http://liquidcode.forumotion.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Spyro Dragon™ December 26th 2014, 6:10 pm

00FF00 - Change Post background According to Group - Page 2 Cynder16
That one made it look like this


if theres no way to fix it on all browsers .. IE, chrome, firefox... Is there a way to force people to use IE before loading into the site?
Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by _Twisted_Mods_ December 26th 2014, 7:37 pm

yea but you will loose almost all of your members..  no one uses IE anymore its outdated and old news
_Twisted_Mods_
_Twisted_Mods_
Helper
Helper

Male Posts : 2108
Reputation : 336
Language : English
Location : Ms

http://liquidcode.forumotion.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Spyro Dragon™ December 26th 2014, 10:54 pm

well can you find a way to fix it on all browsers... u fixed it on IE but it looks messed up on chrome..and when u fix it on chrome its messed up on IE...thers no way to fix it on all browsers?


And maybe everyone that visits ur site uses  chrome but most people who visit mine use IE according to google anyltics
00FF00 - Change Post background According to Group - Page 2 Cynder10



I would still like it to look the same on all browsers...
Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Spyro Dragon™ December 29th 2014, 2:29 am

Bump
Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by _Twisted_Mods_ December 29th 2014, 2:40 am

well you can edit your overall_ header template and add somthing like this above </head>

Code:
<!--[if IE]>
    <style>
place the css you want to use for IE here
</style>
<![endif]-->
_Twisted_Mods_
_Twisted_Mods_
Helper
Helper

Male Posts : 2108
Reputation : 336
Language : English
Location : Ms

http://liquidcode.forumotion.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Spyro Dragon™ December 29th 2014, 4:38 am

so wut code works with chrome and the rest?
Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by _Twisted_Mods_ December 29th 2014, 5:03 am

your regular css should work on the others find the css that works on all the other browsers other then IE and use it in your regular css

then for IE use the css that works for it in the code i mentioned above
_Twisted_Mods_
_Twisted_Mods_
Helper
Helper

Male Posts : 2108
Reputation : 336
Language : English
Location : Ms

http://liquidcode.forumotion.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Spyro Dragon™ December 29th 2014, 6:37 pm

where did i go wrong?


If theres no way to fix it, tell me how to make it to where a popup will say something like " for best experience use IE  " and have them click on it and the site open  in a new tab in IE
Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Spyro Dragon™ December 30th 2014, 6:47 pm

Bump
Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Spyro Dragon™ January 1st 2015, 7:58 am

Bump
Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Ange Tuteur January 1st 2015, 9:09 am

Remove the current CSS and scripts, and try using this :
Code:
$(function() {
  customBg('Spyro ▀█▀ Dragon', 'spyro-background', 'http://i39.servimg.com/u/f39/16/87/57/90/lunapi11.gif');
  customBg('ᴛᴡɪʟɪ ▀█▀ ᴅʀᴀɢᴏɴ', 'twili-background', 'image_here');
 
 
  function customBg(name, classname, image) {
    var ua = window.navigator.userAgent;
    $('.post:has(.name:contains('+name+'))').addClass(classname);
    if (ua.indexOf('MSIE ') > 0 || ua.match(/Trident/)) $('head').append('<style type="text/css">.post.'+classname+' td { background:none }.post.'+classname+' {background: url('+image+') no-repeat transparent }</style>');
    else $('head').append('<style type="text/css">.post.'+classname+' td { background:none }.post.'+classname+' {background: url('+image+') no-repeat center center / 100% 100% transparent }</style>');
  }
})

It's the same, however, the bg css will be automatically generated. Since IE has a tiling problem with rows and cells, the IE sheet excludes resizing and position of the background image.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Spyro Dragon™ January 3rd 2015, 3:09 am

Now its messed up on Chrome..but fixed on IE
Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Ange Tuteur January 3rd 2015, 4:00 am

Okay, try this :
Code:
$(function() {
  customBg('Spyro ▀█▀ Dragon', 'spyro-background', 'http://i39.servimg.com/u/f39/16/87/57/90/lunapi11.gif');
  customBg('ᴛᴡɪʟɪ ▀█▀ ᴅʀᴀɢᴏɴ', 'twili-background', 'image_here');
 
 
  function customBg(name, classname, image) {
    var ua = window.navigator.userAgent, td = 'td';
    $('.post:has(.name:contains('+name+'))').addClass(classname);
    if (ua.match(/Chrome/)) td = 'td:last-child';
    if (ua.indexOf('MSIE ') > 0 || ua.match(/Trident/) || ua.match(/Chrome/)) $('head').append('<style type="text/css">.post.'+classname+' > '+td+' { background:none }.post.'+classname+' {background: url('+image+') no-repeat transparent }</style>');
    else $('head').append('<style type="text/css">.post.'+classname+' td { background:none }.post.'+classname+' {background: url('+image+') no-repeat center center / 100% 100% transparent }</style>');
  }
});

Chrome is a lot more iffy with this method, so we're only going to make the postbody have the background image for it.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Spyro Dragon™ January 3rd 2015, 4:29 am

Its still fixed on IE  , but on Chrome it stll Repeats itself..
Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Ange Tuteur January 3rd 2015, 4:36 am

See if this fixed it :
Code:
$(function() {
  customBg('Spyro ▀█▀ Dragon', 'spyro-background', 'http://i39.servimg.com/u/f39/16/87/57/90/lunapi11.gif');
  customBg('ᴛᴡɪʟɪ ▀█▀ ᴅʀᴀɢᴏɴ', 'twili-background', 'image_here');
 
 
  function customBg(name, classname, image) {
    var ua = window.navigator.userAgent, td = 'td', gc = '';
    $('.post:has(.name:contains('+name+'))').addClass(classname);
    if (ua.match(/Chrome/)) td = 'td:last-child', gc = '.post'+classname+' > td:first-child{background:#000 !important}';
    if (ua.indexOf('MSIE ') > 0 || ua.match(/Trident/) || ua.match(/Chrome/)) $('head').append('<style type="text/css">.post.'+classname+' > '+td+' { background:none }'+gc+'.post.'+classname+' {background: url('+image+') no-repeat transparent }</style>');
    else $('head').append('<style type="text/css">.post.'+classname+' td { background:none }.post.'+classname+' {background: url('+image+') no-repeat center center / 100% 100% transparent }</style>');
  }
});
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Spyro Dragon™ January 3rd 2015, 6:27 am

still jacked on chrome.. Maybe its because im looking at the site on chrome via Mobile?
Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Ange Tuteur January 3rd 2015, 6:35 am

I forgot a decimal on one of the rules for chrome.  grrr!!!!!

Try now :
Code:
$(function() {
  customBg('Spyro ▀█▀ Dragon', 'spyro-background', 'http://i39.servimg.com/u/f39/16/87/57/90/lunapi11.gif');
  customBg('ᴛᴡɪʟɪ ▀█▀ ᴅʀᴀɢᴏɴ', 'twili-background', 'image_here');
 
 
  function customBg(name, classname, image) {
    var ua = window.navigator.userAgent, td = 'td', gc = '';
    $('.post:has(.name:contains('+name+'))').addClass(classname);
    if (ua.match(/Chrome/)) td = 'td:last-child', gc = '.post.'+classname+' > td:first-child{background:#000 !important}';
    if (ua.indexOf('MSIE ') > 0 || ua.match(/Trident/) || ua.match(/Chrome/)) $('head').append('<style type="text/css">.post.'+classname+' > '+td+' { background:none }'+gc+'.post.'+classname+' {background: url('+image+') no-repeat transparent }</style>');
    else $('head').append('<style type="text/css">.post.'+classname+' td { background:none }.post.'+classname+' {background: url('+image+') no-repeat center center / 100% 100% transparent }</style>');
  }
});
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Spyro Dragon™ January 3rd 2015, 7:10 pm

Now it doesn't even show up on either of them
Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Ange Tuteur January 3rd 2015, 7:25 pm

I checked your forum and it looks like there's a period at the end of your script. Remove that and try again.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Spyro Dragon™ January 3rd 2015, 7:28 pm

Where the heck did that period come from.. and finally solved..

Imma change my signature to
- Is there Anything that Ange Tuteur doesn't know?

Thanks Ange tuteur for saving my life yet again..



Wait I just realized something..  on IE its streached out.. on Chrome its different ..acualy that's fine..but on IE theres this annoying Black line how to remove it?
Spyro Dragon™
Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

In progress Re: Change Post background According to Group

Post by Ange Tuteur January 3rd 2015, 8:12 pm

You're welcome Smile

That line comes from the tables border spacing. Try adding this to your stylesheet :
Code:
.forumline { border-spacing:0 }
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Page 2 of 3 Previous  1, 2, 3  Next

Back to top

- Similar topics

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