Last active
April 19, 2017 05:12
-
-
Save braddalton/d051154cbfbeecc0a0d7ae1d3bbc4ed7 to your computer and use it in GitHub Desktop.
Add Sticky Message To Infinity Pro Theme With Sticky Nav Menu https://wp.me/p1lTu0-gPm
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
genesis_register_sidebar( array( | |
'id' => 'sticky-message', | |
'name' => __( 'Sticky Message', 'infinity-pro' ), | |
'description' => __( 'This is the sticky message widget area.', 'infinity-pro' ), | |
) ); | |
add_action( 'genesis_before', 'infinity_pro_sticky_message' ); | |
function infinity_pro_sticky_message() { | |
genesis_widget_area( 'sticky-message', array( | |
'before' => '<div class="sticky-message">', | |
'after' => '</div>', | |
) ); | |
} | |
add_action( 'wp_enqueue_scripts', 'infinity_pro_sticky_message_scripts' ); | |
function infinity_pro_sticky_message_scripts() { | |
wp_enqueue_script( 'infinity-pro-sticky-message', get_bloginfo( 'stylesheet_directory' ) . '/js/sticky.js', array( 'jquery' ), '1.0.0' ); | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
jQuery(function( $ ){ | |
// Add reveal class to sticky message after 100px | |
$(document).on("scroll", function(){ | |
if($(document).scrollTop() > 100){ | |
$(".sticky-message").addClass("reveal"); | |
} else { | |
$(".sticky-message").removeClass("reveal"); | |
} | |
}); | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.sticky-message { | |
background-color: #333; | |
font-size: 16px; | |
opacity: 0; | |
padding-bottom: 20px; | |
padding-top: 100px; | |
position: fixed; | |
text-align: center; | |
width: 100%; | |
z-index: 999; | |
} | |
.sticky-message { | |
-webkit-transition: all 0.3s ease-in-out; | |
-moz-transition: all 0.3s ease-in-out; | |
-ms-transition: all 0.3s ease-in-out; | |
-o-transition: all 0.3s ease-in-out; | |
transition: all 0.3s ease-in-out; | |
} | |
.sticky-message.reveal { | |
opacity: 1; | |
} | |
.sticky-message, | |
.sticky-message a:hover, | |
.sticky-message p { | |
color: #fff; | |
} | |
.sticky-message a { | |
color: #999; | |
} | |
.sticky-message p:last-child { | |
margin-bottom: 0; | |
} | |
@media only screen and (max-width: 800px) { | |
.sticky-message { | |
padding-top: 20px; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment