From the course: CSS: Advanced Typographic Techniques

Unlock the full course today

Join today to access over 22,500 courses taught by industry experts or purchase this course individually.

Triggering transitions

Triggering transitions - jQuery Tutorial

From the course: CSS: Advanced Typographic Techniques

Start my 1-month free trial

Triggering transitions

Once you define a transition on an element, all you need to do to trigger it is change the targeted properties based on certain pseudo selectors like hover, focus and active or you could even trigger 'em with JavaScript if you want to do something like that. Anytime that a targeted property changes. The transition is going to animate. So to do this we are going to be working in the focus.htm file in the 05 underscore 04 directory and I am just going to scroll down into my CSS and you can see we have our span selected there. I'm going to add one to this and I am going to do a span colon hover so when that span is hovered over we're going to change some of these properties. Alright. So what are we going to change? Well let's start by changing the text shadow. I'm going to grab the text shadow and I'm just going to tell it none. So no shadow, no blur whatsoever on that. For color, I'm going to change the color property as well. For color I'm going to do RGBa. let's do 255 255, 255, again…

Contents