Welcome, Guest
Username: Password: Remember me
  • Page:
  • 1

TOPIC: [SOLVED]Opacity of the Event background colour in Calendar

[SOLVED]Opacity of the Event background colour in Calendar 1 year 2 months ago #25114

Hi,

I use this pretty cool feature that allows us to have the category background color in calendar background events.
It has been explained here by Hoffi. Thanks to him! ;)

I'd like to play with background color transparency...
So I use:
div#jem .eventcontentinner {
  opacity: 0.85;
}
But it fades the text event color too...

If it was possible to set rgba values for the backend for category color instead of hexadecimal value, we could manage that perfectly.

Do you know an easy way to override JEM for that?
Or would it be added to the very bottom of the wish list?
;)

Thanks
Paul

Please Log in or Create an account to join the conversation.

[SOLVED]Opacity of the Event background colour in Calendar 1 year 2 months ago #25123

  • Egnarts
  • Egnarts's Avatar
  • Offline
  • Gold Boarder
  • Gold Boarder
  • Posts: 262
  • Karma: -3
  • Thank you received: 110
You can embedd jQuery-Code to modify the background-color. I recommend a hidden module that you will never touch with a WYSIWYG editor. Because they often strip script tags.
Change that 0.5 in the script to your wanted transparancy level (between 0 and 1)
<script>
function parseColor(rgb) {
 rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
 return rgb;
}
  
jQuery( document ).ready(function() {
  var events = jQuery(".eventcontentinner");
  var color;
  jQuery.each(events, function(i, node) {
    color = parseColor(jQuery(node).css("background-color"));
    if (color != null) {
      jQuery(node).css("background-color", "rgba(" + color[1] + "," + color[2] + "," + color[3] + ",0.5");
    }
  });
});
</script>

And yes i know. This is a very very dirty solution. But sometimes you need such solutions...
Take a look at the responsive version of JEM: The Responsive JEM
The following user(s) said Thank You: Mister PAul

Please Log in or Create an account to join the conversation.

Last edit: by Egnarts.

[SOLVED]Opacity of the Event background colour in Calendar 1 year 2 months ago #25124

Thank you Egnarts !
;)

Please Log in or Create an account to join the conversation.

  • Page:
  • 1
Time to create page: 0.193 seconds

Donate

If you find JEM useful and if you use it on your site, please consider a donation to the project.

Private Messages

You are not logged in.