Can some one more knowledgeable than I point me in the right direction here please?
What must I need to adjust in this script below so that the image slider sits on the "left"
of the page and not in the center? Thank you in advance. p.s I am only learning.
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script><script language="javascript">'use strict';$(function() {var width = 401; var animationSpeed = 1400; var pause = 5000; var currentSlide = 1;var $sdr1034 = $('#sdr1034'); var $slideContainer = $('.sld', $sdr1034); var $sld = $('.slide', $sdr1034); var interval; function startsdr1034() { interval = setInterval(function() { $slideContainer.animate({'margin-left': '-='+width}, animationSpeed, function() {if (++currentSlide === $sld.length) {currentSlide = 1; $slideContainer.css('margin-left', 0); }});}, pause);} function pausesdr1034() {clearInterval(interval);}$slideContainer.on('mouseenter', pausesdr1034).on('mouseleave', startsdr1034);startsdr1034();});</script><div style="width: 401px; margin: 0 auto;"><div style="position: relative; width: 401px; "><style type="text/css">#gpoy {position: absolute; right:-126px; top:2px; padding: 6px 0px 3px; z-index:99; opacity: 0.9; transition: 1s; line-height: 12px;}.repper {width: 405px; margin: 0 auto; position: relative; overflow: hidden; border-radius: 15px; box-shadow: 7px 7px 9px #888888 ;}.repper:hover #gpoy {transition: 2s; right:17px; }</style><div class="repper"><div id="gpoy"><A style="font-weight: normal; text-shadow: 1px 1px #555555; color: #FFFFFF; text-decoration:none; font-size: 6pt; line-height:10px; font-family: arial;" HREF="http://www.123-slideshow.com" TARGET="_blank"> free slider creation</A></div><style type="text/css">#sdr1034 {width: 401px; height: 300px; border: 2px solid #FFFFFF; border-radius: 15px; overflow: hidden; position: relative; cursor: pointer; }#sdr1034 .sld {width: 11629px; height: 300px; display: block; margin: 0; padding: 0;}#sdr1034 .slide {width: 401px; height: 300px; float: left; list-style-type: none;}.DOT180802 {position: absolute; max-width: 401px; margin: 0px;}.c124595 {position: absolute; bottom: 0px; width:100%; padding: 10px; background-color: rgba(0, 0, 0, 0.5); color: #FFFFFF; font-size:12pt; font-family:Tahoma; text-align:center; line-height:24px; z-index:33; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}</style>
<div id="sdr1034">
<ul class="sld">
<li class="slide slide1">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cda90eee5.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide2">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cda58175d.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide3">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cda1500f5.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide4">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cd95345ce.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide5">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cd9141de5.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide6">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cd8d7d1dd.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide7">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cd8967f30.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide8">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cd848b1d5.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide9">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cbca6861b.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide10">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cbc9712c3.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide11">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cbc73c17c.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide12">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cbc6317ce.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide13">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cbc25ba5f.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide14">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cbc0c556f.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide15">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cbad8ad4a.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide16">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cbaa04dd5.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide17">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cba873eaa.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide18">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cba77d13b.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide19">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cb8d5d2ac.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide20">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cb8c59291.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide21">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cb8612c2d.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide22">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cb857af29.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide23">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cb8271816.png">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide24">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cb83d4911.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide25">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cb82b4a33.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide26">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cb8083d12.png">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide27">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2c/2cb73b6de7.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
<li class="slide slide28">
<figure class="DOT180802">
<IMG SRC="https://i.imgsafe.org/2d/2daf92390b.jpeg">
<figcaption class="c124595">
Discounted price $5.00!
</figcaption>
</figure>
</li>
</ul></div></div></div>
</div>
</body>
</html>