Skip to content

Instantly share code, notes, and snippets.

@srikat

srikat/home.js Secret

Last active October 26, 2015 23:47
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save srikat/9223839 to your computer and use it in GitHub Desktop.
Save srikat/9223839 to your computer and use it in GitHub Desktop.
Setting Soliloquy slider as background for first homepage section in Centric. http://sridharkatakam.com/set-soliloquy-slider-background-first-homepage-section-centric-pro/
<p class="arrow"><a href="#home-widgets"></a></p>
$('.home-featured .wrap') .css({'height': (($(window).height()))+'px'});
$(window).resize(function(){
$('.home-featured .wrap') .css({'height': (($(window).height()))+'px'});
});
$(".home-featured .home-widgets-1 .widget:last-child").after('<p class="arrow"><a href="#home-widgets"></a></p>');
/* Soliloquy slider on homepage
--------------------------------------------- */
.home-featured {
position: relative;
}
.home-featured .wrap,
.home-featured .home-widgets-1 {
display: block;
}
.home-featured .wrap {
max-width: none;
margin-top: 0;
}
.home-featured .home-widgets-1 {
padding: 0;
}
.home-featured .soliloquy {
margin-bottom: 0;
}
.home-featured .soliloquy-container {
margin-bottom: 0 !important;
}
.home-featured .soliloquy-container .soliloquy-image {
width: 100%;
}
.home-featured .widget_text {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.home-featured .widget_text .widget-wrap {
max-width: 782px;
margin: 0 auto;
}
@media only screen and (max-width: 1217px) {
.home-featured .widget_text .widget-wrap {
padding: 100px 0;
}
.home-featured .widget_text {
position: static;
-webkit-transform: none;
-moz-transform: none;
-ms-transform: none;
-o-transform: none;
transform: none;
}
}
@media only screen and (max-width: 1023px) {
.home-featured .wrap {
padding-left: 0;
padding-right: 0;
}
}
@media only screen and (max-width: 768px) {
.home-featured .widget_text {
padding-left: 5%;
padding-right: 5%;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment