Thead collapse image show on hover effect
#1
Thead collapse image effect
Im this tutorial you will learn how to add a hover effect to the Thead collapse buttons (This is seen alot on premium/custom themes) Smile

First go to global.css and find the code:
.expcolimage {
	float: right;
	width: auto;
	vertical-align: middle;
	margin-top: 3px;
}

Now replace that with:
.expcolimage {
	width: auto;
	float: right;
	vertical-align: middle;
	margin-top: 0px;
}
.thead .expcolimage img {
	opacity: 0;
	-o-transition: opacity .25s ease-in-out;
	-moz-transition: opacity .25s ease-in-out;
	-webkit-transition: opacity .25s ease-in-out;
}
.thead:hover .expcolimage img {
	opacity: 1;
}

Then save global.css and you are done. Smile

Demo: http://icypromotion.com (Scroll over the thead)

-Xige Time.
Reply
#2
Though the tutorial is not yours but still appreciated for sharing.
Reply
#3
not work for me Sad
Reply
#4
(2012-10-09, 09:36 PM)yusril Wrote: not work for me Sad

What browser you using, also which version?
Reply
#5
(2012-10-09, 03:10 PM)effone Wrote: Though the tutorial is not yours but still appreciated for sharing.

Yes it is mine.
Reply


Forum Jump:


Users browsing this thread: 1 Guest(s)