Edit

Editing: INSTRUCTIONS.html

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Instructions</title>

<style>

html, body {
			margin: 0;
			font-family: Arial, sans;
			line-height: 1.3em;
			color: #333;
			text-align: justify;
		}

main {
			width: 650px;
			margin: 50px auto;
			padding: 20px;
			background: #e9e9e9;
			border-radius: 5px;
		}

h2 {
			margin: 0;
			font: 20px/1em Arial;
		}

p:nth-child(2) {
			padding-bottom: 20px;
			margin-bottom: 20px;
			border-bottom: 1px solid #ccc;
		}

img {
			display: block;
			margin: 20px auto 0 auto;
			border-radius: 5px;
		}

a {
			color: #1389d4;
		}

i {
			padding: 1px 5px;
			border-radius: 5px;
			background: #d1d1d1;
		}
	</style>
</head>
<body>

<main>
		<h2>Instructions</h2>
		<p>
			<b>TL;DR:</b> Copy this folder into LayerSlider's <i>example</i> directory, then open <i>slider.html</i>.
			<img src="images/ls-instructions.png" alt="instructions">
		</p>
		<p>This slider example requires the LayerSlider plugin files, which are not included in this package. We assume that you already have downloaded LayerSlider previously and you have the extracted plugin files on your machine. If it is not the case, you can download or purchase LayerSlider by <a target="_blank" href="https://kreaturamedia.com/cart/ls-jquery/">clicking here</a>.</p>
		<p>Navigate to the LayerSlider plugin folder on your machine and copy this folder into LayerSlider's <i>example</i> directory.</p>
		<p>If you have managed to copy this file to the right place, this example should appear and work as intended when you open the <i>slider.html</i> file. Otherwise this example might appear broken.</p>
		<p>Alternatively: you can manually update the URL of CSS and JavaScript files in order to load them from a different location.</p>
	</main>
</body>
</html>

Back