php 滚动到顶部

Posted 2021-05-04

.to-top {
  border-radius: 50px;
  color: #fff;
	display:inline-block;
	height:40px;
	width:40px;
	position:fixed;
	bottom:40px;
	right:10px;
  text-align: center;
	white-space:nowrap;
	background: #d10000;
	visibility:hidden;
	opacity:0;
	-webkit-transition:all .3s;
	-moz-transition:all .3s;
	transition:all .3s;
}

.to-top i {
  line-height: 40px;
}

.to-top.top-is-visible {
	visibility:visible;
	opacity:1;
}

/*.to-top.top-fade-out {
	opacity:.5;
}*/

.no-touch .to-top:hover {
	opacity: .8;
}

@media only screen and (min-width: 768px) {
	.to-top {
		right:20px;
		bottom:20px;
	}
}

@media only screen and (min-width: 1024px) {
	.to-top {
		right:30px;
		bottom:30px;
	}
}

jQuery(document).ready(function($){
	// Scroll (in pixels) after which the "To Top" link is shown
	var offset = 300,
		//Scroll (in pixels) after which the "back to top" link opacity is reduced
		offset_opacity = 1200,
		//Duration of the top scrolling animation (in ms)
		scroll_top_duration = 500,
		//Get the "To Top" link
		$back_to_top = $('.to-top');

	//Visible or not "To Top" link
	$(window).scroll(function(){
		( $(this).scrollTop() > offset ) ? $back_to_top.addClass('top-is-visible') : $back_to_top.removeClass('top-is-visible top-fade-out');
// 		if( $(this).scrollTop() > offset_opacity ) { 
// 			$back_to_top.addClass('top-fade-out');
// 		}
	});

	//Smoothy scroll to top
	$back_to_top.on('click', function(event){
		event.preventDefault();
		$('body,html').animate({
			scrollTop: 0 ,
		 	}, scroll_top_duration
		);
	});

});

add_action( 'wp_enqueue_scripts', 'enqueue_font_awesome' );
function enqueue_font_awesome() {
	
	wp_enqueue_style( 'font-awesome', '//maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css' );
	
}

// Enqueue To Top script
add_action( 'wp_enqueue_scripts', 'to_top_script' );
function to_top_script() {
    wp_enqueue_script( 'to-top', get_stylesheet_directory_uri() . '/js/to-top.js', array( 'jquery' ), '1.0', true );
}

// Add To Top button
add_action( 'genesis_before', 'genesis_to_top');
	function genesis_to_top() {
	 echo '<a href="#0" class="to-top" title="Back To Top"><i class="fas fa fa-arrow-up"></i></a>';
}