Clients Carrousel

[bigbangthinking]

Hi

I would like to make the clients containers that are 165×150 px only 100×100 px, with out the black line on roll over, and 100% opacity on non roll over.

Thanks

http://www.bigbangthinking.com

[Swift Ideas – Ed]

Hi there,

You would need to modify the template files to make them that size – it’s not possible with just CSS.

You can add this css to change the hover:

.client-item figure {
	border-color: transparent!important;
	opacity: 1;
	-moz-opacity: 1;
	filter:alpha(opacity= 100);
}

Hope that helps.

– Ed

[bigbangthinking]

Thanks ED

The code you give me works great. Thank you.

I remembered that before I had solved this same problem in PinPoint theme via custom CSS. So checked out and found thid CSS that @Mohammad had given me some time ago. Leave it here if some one else needs it.

🙂

/*========== Clients Shortcode ==========*/
.clients-items {
	margin-right: 0;
}

.client-item {
	float: left;
	margin-right: 25px;
	width: 80px;
	margin-bottom: 25px;
}

.client-item figure {
	position: relative;
	width: 80px;
	height: 80px;
	border: 0 solid transparent;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	opacity: 1;
	-moz-opacity: .75;
	filter: alpha(opacity= 100);
	transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-webkit-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
}

.client-item figure:hover {
	opacity: .5;
	-moz-opacity: .5;
	filter: alpha(opacity= 50);
}

.client-item figure img {
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	max-height: 100%;
	max-width: 100%;
	width: auto;
	display: block;
}

[Mohammad – SUPPORT]

Hi,
You most welcome. I’m glad that issue resolved. Thanks for code sharing :-).
With Best Regards
Swift Ideas