Here is the line of code you can use to add a class or ID to an element in your webpage when a user hovers over it (for example: if you want to add a class called “active” to an li element with a class called “top-nav” in the div called “menu” when a user hovers over it):
<script>
$('#menu li').hover (
function(){ $('.top-nav').addClass('active')},
function() {$('.top-nav').removeClass('active')}
)
</script>
Here is the simple way to add a semi-transparent background to a div without affecting the text elements inside the div.
Instead of this code:
background:#555; opacity:1; filter:alpha(opacity=100); /* For IE8 and earlier */
Use this:
background-color:rgba(255,0,0,0.5);
If you dont know the rbga value of the hexidecimal color you want to use, you can find it at http://www.color-hex.com/. Just type the hexidecimal value into the box at the top right corner of the page and click “Get color info.”
Take the rgb value it provides you and put the three numbers into the paranthese in the block of code above. Then simply add the percent of opacity that you want to add to the background (i.e. 0.5 for 50%, 0.8 for 80%, etc.).
Here is the easiest way I have found to add a unique body class to individual pages in a Concrete5 site.
First, in your dashboard go to “Pages and Themes,”then “Attributes,” and add a custom attribute (text field) called bodyclass.
Next, open your theme’s header.php file and add:
class="<?php echo $c->getCollectionAttributeValue('bodyclass')?>"
to your < body > tag, so it reads like this:
<body class="<?php echo $c->getCollectionAttributeValue('bodyclass')?>">
For any page that you want to apply a custom class to, simply add the Body Class custom attribute and type whatever class name you want into the Body Class Custom Attribute text field. When you save your changes, your opening < body > tag will now look like:
<body class="red">