locked
ASP.NET Slideshow (powered by easyrotator) RRS feed

  • Question

  • User-1869230235 posted

    Hello guys, i know many of us are interested in slideshows. I wanna share my codes so that you can use them.

    <script type="text/javascript" src="http://c520866.r66.cf2.rackcdn.com/1/js/easy_rotator.min.js"></script>
    <div class="dwuserEasyRotator" style="width: 1010px; height: 500px; ; text-align: left;" data-erConfig="{autoplayEnabled:true, autoplayDelay:3500, lpp:'102-105-108-101-58-47-47-47-67-58-47-85-115-101-114-115-47-70-105-107-114-97-116-47-68-111-99-117-109-101-110-116-115-47-69-97-115-121-82-111-116-97-116-111-114-80-114-101-118-105-101-119-47-112-114-101-118-105-101-119-95-115-119-102-115-47', wv:1}" data-erName="Myrotator" data-erTID="{8hxdldm2r5203643338431}">
    	<div data-ertype="content" style="display: none;"><ul data-erlabel="Main Category">
    	<li>
    		<a class="mainLink" href="Redirect URL when you click"><img class="main" src="your image" alt="title" /></a>
    		<img class="thumb" src="yourimage" />
    		<span class="title">Title</span>
    		<span class="desc">Description</span>
    	</li>
    	<li>
    		<a class="mainLink" href="Redirect URL when you click"><img class="main" src="Your img" alt="title" /></a>
    		<img class="thumb" src="your image" />
    		<span class="title">Title</span>
    		<span class="desc">Description</span>
    	</li>
    	<li>
    		<a class="mainLink" href="Redirect URL when you click"><img class="main" src="your img" alt="title" /></a>
    		<img class="thumb" src="your image" />
    		<span class="title">Title</span>
    		<span class="desc">Description</span>
    	</li>
    </ul>
    </div>
    	<div data-ertype="layout" data-ertemplateName="NONE" style="">			<div class="erimgMain" style="; left:0;right:0;top:0;bottom:0;" data-erConfig="{___numTiles:3, scaleMode:'fillArea', duration:800, imgType:'main', alwaysPreviousButton:true, __loopNextButton:false, __arrowButtonMode:'rollover'}">
    				<div class="erimgMain_slides" style="; left:0; top:0; bottom:0; right:0;">
    					<div class="erimgMain_slide">
    						<div class="erimgMain_img" style="; left: 0; right: 0; top:0;bottom:0;"></div>
    						<div class="" style="; left:0; right:0; bottom: 20px; padding: 7px 200px 7px 20px; background: #000; background:rgba(0,0,0,0.9); color: #FFF; font-family: Georgia, 'Times New Roman', Times, _serif; text-align: left;">
    							<p class="erimgMain_title" style="padding: 0; margin: 0 0 3px 0; font-weight: bold; font-size: 22px; color: #FFF;"></p>
    							<p class="erimgMain_desc" style="padding: 0; margin: 0; font: 12px/16px Arial,_sans; color: #FFF;"></p>
    						</div>
    					</div>
    				</div>
    				<!-- <div class="erimgMain_arrowLeft" style="; left: 10px; top: 50%; margin-top: -15px;" data-erConfig="{image:'circleSmall', image2:'circleSmall'}"></div>
    				<div class="erimgMain_arrowRight" style="; right: 10px; top: 50%; margin-top: -15px;"></div> -->
    			</div>
    			<div class="erdots" style="overflow: hidden; margin: 0; font-size: 10px; font-family: 'Lucida Grande', 'Lucida Sans', Arial, _sans; color: #FFF; ; right:6px; bottom:30px; width:200px;" data-erConfig="{showText:false}" align="center">
    				<div class="erdots_wrap" style="wasbackground-color: #CFC; float: right;" align="left"> <!-- modify the float on this element to make left/right/none=center aligned. -->
    					<span class="erdots_btn_selected" 
                            style="padding-left: 0; width: 30px; height: 20px; display: inline-block; text-align: center; vertical-align: middle; line-height: 20px; margin: 0 2px 0 0; cursor: default; background: url('http://easyrotator.s3.amazonaws.com/1/i/rotator/dots/export/20_14_wite_65.png') no-repeat left top;">
    						&nbsp;
    					</span>
    					<span class="erdots_btn_normal" 
                            style="padding-left: 0; width: 30px; height: 20px; display: inline-block; text-align: center; vertical-align: middle; line-height: 20px; margin: 0 2px 0 0; cursor: pointer; background: url('http://easyrotator.s3.amazonaws.com/1/i/rotator/dots/export/20_14_wite_35.png') no-repeat left top;">
    						&nbsp;
    					</span>
    					<span class="erdots_btn_hover" 
                            style="padding-left: 0; width: 30px; height: 20px; display: inline-block; text-align: center; vertical-align: middle; line-height: 20px; margin: 0 2px 0 0; cursor: pointer; background: url('http://easyrotator.s3.amazonaws.com/1/i/rotator/dots/export/20_14_wite_65.png') no-repeat left top;">
    						&nbsp;
    					</span>
    				</div>
    			</div><div class="erabout erFixCSS3" style="color: #FFF; text-align: left; background: #000; background:rgba(0,0,0,0.93); border: 2px solid #FFF; padding: 20px; font: normal 11px/14px Verdana,_sans; width: 300px; border-radius: 10px; display:none;">
    			This <a style="color:#FFF;" href="http://www.dwuser.com/easyrotator/" target="_blank">jQuery slider</a> was created with the free <a style="color:#FFF;" href="http://www.dwuser.com/easyrotator/" target="_blank">EasyRotator</a> software from DWUser.com.
    			<br /><br />
    			Need a powerful <a style="color:#FFF;" href="http://www.dwuser.com/flashslideshow/" target="_blank">Flash slideshow</a> creator with built-in iPhone/iPad/Android support?  EasyRotator is supported by the <a style="color:#FFF;" href="http://www.dwuser.com/flashslideshow/" target="_blank">XML Flash Slideshow v4 Software</a>.
    			<br /><br />
    			<a style="color:#FFF;" href="#" class="erabout_ok">OK</a>   
    		</div>
    		<noscript>
    			Rotator powered by <a href="http://www.dwuser.com/easyrotator/">EasyRotator</a>, a free and easy jQuery slider builder from DWUser.com.  Please enable JavaScript to view.
    		</noscript>
    		<script type="text/javascript">		    /*Avoid IE gzip bug*/(function (b, c, d) { try { if (!b[d]) { b[d] = "temp"; var a = c.createElement("script"); a.type = "text/javascript"; a.src = "http://easyrotator.s3.amazonaws.com/1/js/nozip/easy_rotator.min.js"; c.getElementsByTagName("head")[0].appendChild(a) } } catch (e) { alert("EasyRotator fail; contact support.") } })(window, document, "er_$144");</script>
    	
    	</div>
    </div>
    
    

    I used EasyRotator to make these codes(www.dwuser.com)

    You can just copy the html code and modify the img url, website url.

    Thank you!

    Saturday, September 22, 2012 4:33 PM

All replies

  • User170691248 posted

    Thanks,

    It works fine.


    :)

    Wednesday, June 26, 2013 2:52 AM
  • User-1434367 posted

    Good one its working fine..Smile

    thank you Ahmad Azizov

    Tuesday, August 6, 2013 12:46 AM