Dreamweaver CC has a new CSS3 transitions panel to assist you with creating CSS3 transitions
We will add a transition to our page using the CSS transitions panel that will create interactivity on the page using pure CSS3
Open the CSS transitions panel by going to Window->CSS Transitions
Select #tranquil and click the + sign
Target rule: #tranquil
Transition: hover, use same transition
Add the following properties:
Put this in the browser and hover over the upper left area of the box in Chrome and Firefox
Now look at the code that was created, there is a hover state added and the transform property is added to the ID without the hover state
We can now add additional properties to this transition if we want
The CSS Transitions panel makes it easy to add CSS transitions to page elements
Working with CSS Transitions Panel
Lecture Slides are screen-captured images of important points in the lecture. Students can download and print out these lecture slide images to do practice problems as well as take notes while watching the lecture.
Educator.com recommends Adobe Dreamweaver CC to use with our Dreamweaver CC course. Adobe Dreamweaver CC is the leading all-in-one visual development tool used by web designers and developers worldwide to create, publish, and manage their websites and mobile content. Membership includes the full version of Dreamweaver CC to download, install, and run on your computer. You will get immediate access to all the latest updates and new features as soon as they're released.