jQuery

【jQuery】ウェブサイトやブログで使えるカスタマイズ可能なスクロールトップボタンdyScrollUpJS

June 10, 2017

dyScrollUpJSは、ウェブサイトやブログでスクロールトップボタンを作成するために使用できる軽量のプラグイン。

HTML

head内に

<link rel="stylesheet" href="/path/to/dyscrollup.min.css" />

<!-- first jQuery -->
<script type="text/javascript" src="/path/to/jquery.min.js">

<!-- next dyScrollUpJS -->
<script type="text/javascript" src="/path/to/dyscrollup.min.js">

<!-- finally dyScrollUpJS initialize code -->
dyscrollup.init();

Configuration

showafter(optional)	300
scrolldelay(optional)	500
position(optional)	“right”
image(optional)	“”
shape(optional)	“circle”
width(optional)	32
height(optional)	32

Example:

<!DOCTYPE html>
<html>
	<head>
		<title>Index Page</title>
		<link type="text/css" rel="stylesheet" href="css/default.css">

		<!-- dyscrollup style -->
		<link type="text/css" rel="stylesheet" href="css/dyscrollup.min.css">

	</head>
	<body>

		<!-- put your content here -->

		<!-- javascript -->
		<script type="text/javascript" src="js/jquery.min.js"></script>
		<script type="text/javascript" src="js/dyscrollup.min.js"></script>

		<!-- init dyscrollup -->
		<script type="text/javascript">
		dyscrollup.init({
			showafter : 600,
			scrolldelay : 1000,
			position : "left",
			image : "image/32.png",
			shape : "other",
			width : 30,
			height : 30
		});
		</script>
	</body>
</html>

MIT

Demo/Download