The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Post background image or color if gradient don't work

View previous topic View next topic Go down

Solved Post background image or color if gradient don't work

Post by Ikerepc on Thu Feb 13, 2014 8:32 pm

Hello all!

My forum is here: http://yourdesign.forumotion.com
As you can see staffs have different posts colors than others (Example: http://yourdesign.forumotion.com/t6-hello-all )

But gradient is with css, and don't work on some borowsers.

So have there any code for making that when gradient don't show up, it display image or color (rgba, but if not html can be too)?

My forum version is punBB

CSS:
Code:
.bhjk {
 background: -webkit-linear-gradient(rgba(0,128,128,0.4) 40px, rgba(0,128,128,0.2) 40%, rgba(0,128,128,0) 100%)!important; /* For Safari */
 background: -o-linear-gradient(rgba(0,128,128,0.4) 40px, rgba(0,128,128,0.2) 40%, rgba(0,128,128,0) 100%)!important; /* For Opera 11.1 to 12.0 */
 background: -moz-linear-gradient(rgba(0,128,128,0.4) 40px, rgba(0,128,128,0.2) 40%, rgba(0,128,128,0) 100%)!important; /* For Firefox 3.6 to 15 */
 background: linear-gradient(rgba(0,128,128,0.4) 40px, rgba(0,128,128,0.2) 40%, rgba(0,128,128,0) 100%)!important; /* Standard syntax (must be last) */
  font-color: gray!important;
}

jQuery
Code:
$(document).ready(function(){
$('.post:has(".admin") .postmain').addClass('bhjk');
});

Please help?


Last edited by Zyon on Wed Feb 19, 2014 10:23 am; edited 1 time in total

Ikerepc
Active Poster

Male Posts : 1114
Reputation : 152
Language : Croatian, HTML, CSS, jQuery, JavaScript, PHP, SQL, Bascom, Python, C, FBD & LAD for PLC and more... Little English :D
Location : Around electronics and progmamming ;)

http://help.forumotion.com

Back to top Go down

Solved Re: Post background image or color if gradient don't work

Post by Mati on Fri Feb 14, 2014 2:44 pm

In the CSS it should be color: and not font-color that wont work Cool

Try this

Code:
.bhjk {
  background: -webkit-linear-gradient(rgba(0,128,128,0.4) 40px, rgba(0,128,128,0.2) 40%, rgba(0,128,128,0) 100%)!important; /* For Safari */
  background: -o-linear-gradient(rgba(0,128,128,0.4) 40px, rgba(0,128,128,0.2) 40%, rgba(0,128,128,0) 100%)!important; /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(rgba(0,128,128,0.4) 40px, rgba(0,128,128,0.2) 40%, rgba(0,128,128,0) 100%)!important; /* For Firefox 3.6 to 15 */
  background: linear-gradient(rgba(0,128,128,0.4) 40px, rgba(0,128,128,0.2) 40%, rgba(0,128,128,0) 100%)!important; /* Standard syntax (must be last) */
    color: gray!important;
}

Mati
Active Poster

Posts : 1896
Reputation : 283
Language : || HTML || CSS || jQuery ||
Location : At the Gym

http://forumdirectory.forumotion.net/

Back to top Go down

Solved Re: Post background image or color if gradient don't work

Post by Ikerepc on Fri Feb 14, 2014 10:03 pm

I know, that was mystake with copying to this topic.

Do you know answer???

Ikerepc
Active Poster

Male Posts : 1114
Reputation : 152
Language : Croatian, HTML, CSS, jQuery, JavaScript, PHP, SQL, Bascom, Python, C, FBD & LAD for PLC and more... Little English :D
Location : Around electronics and progmamming ;)

http://help.forumotion.com

Back to top Go down

Solved Re: Post background image or color if gradient don't work

Post by Ikerepc on Sun Feb 16, 2014 12:56 am

anyone?

Ikerepc
Active Poster

Male Posts : 1114
Reputation : 152
Language : Croatian, HTML, CSS, jQuery, JavaScript, PHP, SQL, Bascom, Python, C, FBD & LAD for PLC and more... Little English :D
Location : Around electronics and progmamming ;)

http://help.forumotion.com

Back to top Go down

Solved Re: Post background image or color if gradient don't work

Post by Ange Tuteur on Sun Feb 16, 2014 10:54 am

Hi Zion,

If you want a fallback for browsers that do not support gradient, it would look like this :
Code:
.bhjk {
 /* Our fallback */
 
 background-color:#00f;
 background-image:url();
 
 /* CSS Gradient */
 background: -webkit-linear-gradient(rgba(0,128,128,0.4) 40px, rgba(0,128,128,0.2) 40%, rgba(0,128,128,0) 100%)!important; /* For Safari */
 background: -o-linear-gradient(rgba(0,128,128,0.4) 40px, rgba(0,128,128,0.2) 40%, rgba(0,128,128,0) 100%)!important; /* For Opera 11.1 to 12.0 */
 background: -moz-linear-gradient(rgba(0,128,128,0.4) 40px, rgba(0,128,128,0.2) 40%, rgba(0,128,128,0) 100%)!important; /* For Firefox 3.6 to 15 */
 background: linear-gradient(rgba(0,128,128,0.4) 40px, rgba(0,128,128,0.2) 40%, rgba(0,128,128,0) 100%)!important; /* Standard syntax (must be last) */
  font-color: gray!important;
}

You can include a color, or an image. You'll use an image that is similar to your gradient so you would still have the same effect.

Ange Tuteur
Forumaster

Male Posts : 13035
Reputation : 2714
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Post background image or color if gradient don't work

Post by Ikerepc on Mon Feb 17, 2014 7:59 pm

I'm sorry, but this don't work...

Ikerepc
Active Poster

Male Posts : 1114
Reputation : 152
Language : Croatian, HTML, CSS, jQuery, JavaScript, PHP, SQL, Bascom, Python, C, FBD & LAD for PLC and more... Little English :D
Location : Around electronics and progmamming ;)

http://help.forumotion.com

Back to top Go down

Solved Re: Post background image or color if gradient don't work

Post by Ange Tuteur on Tue Feb 18, 2014 2:16 pm

Did you add important ?
Code:
.bhjk {
/* Our fallback */
     
background-color:#00f !important;
   
/* CSS Gradient */
background: -webkit-linear-gradient(rgba(0,128,128,0.4) 40px, rgba(0,128,128,0.2) 40%, rgba(0,128,128,0) 100%)!important; /* For Safari */
background: -o-linear-gradient(rgba(0,128,128,0.4) 40px, rgba(0,128,128,0.2) 40%, rgba(0,128,128,0) 100%)!important; /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(rgba(0,128,128,0.4) 40px, rgba(0,128,128,0.2) 40%, rgba(0,128,128,0) 100%)!important; /* For Firefox 3.6 to 15 */
background: linear-gradient(rgba(0,128,128,0.4) 40px, rgba(0,128,128,0.2) 40%, rgba(0,128,128,0) 100%)!important; /* Standard syntax (must be last) */
color: gray !important;
}

Ange Tuteur
Forumaster

Male Posts : 13035
Reputation : 2714
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Post background image or color if gradient don't work

Post by Ikerepc on Wed Feb 19, 2014 10:20 am

Thanks!
It work now.

Ikerepc
Active Poster

Male Posts : 1114
Reputation : 152
Language : Croatian, HTML, CSS, jQuery, JavaScript, PHP, SQL, Bascom, Python, C, FBD & LAD for PLC and more... Little English :D
Location : Around electronics and progmamming ;)

http://help.forumotion.com

Back to top Go down

Solved Re: Post background image or color if gradient don't work

Post by Jophy on Wed Feb 19, 2014 10:24 am

Solved => Locked

Jophy
ForumGuru

Male Posts : 17924
Reputation : 835
Language : English
Location : Somewhere

Back to top Go down

View previous topic View next topic Back to top


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