View Source

The example above shows how you can use Custom CSS Code for Confluence to add hover effects to your images.

CSS Code

.confluence-embedded-file-wrapper {
	display: block;
	overflow: hidden;
}

section {
	text-align: center;
}

img {
	-webkit-transform: rotate(15deg) scale(1.4);
	transform: rotate(15deg) scale(1.4);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}

img:hover {
	-webkit-transform: rotate(0) scale(1);
	transform: rotate(0) scale(1);
}

^{The code above is rendered by "}^{Prism Syntax Highlighter for Confluence}^{" which supports highlighting CSS syntax.}