Click here to Skip to main content
15,920,513 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
See more:
I am using bxslider but unable to get the fadein fade out effect in it..I implemented the link from here: http://www.htmldrive.net/items/demo/451/bxSlider-jQuery-Content-Slider
Posted

1 solution

if you do not want the slider that you mentioned then you can use the below code nothing to do with cs code only aspx code enough.
and please place images in mentioned folder ans js also
do search on google for jquery-1.7.1.min.js

if u have any problem then get back to me on codeproject




ASPX code

<head runat="server">
<script src="js/jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
var images=new Array('images/gallery1.png','images/gallery2.png','images/gallery3.png','images/gallery4.png','/images/gallery5.png');
var nextimage=0;
$(document).ready(function (){
doSlideshow();
});
function doSlideshow()
{
if($('.slideshowimage').length!=0)
{
$('.slideshowimage').fadeOut(500,function(){$(this).remove()});
you();
}
else
{
you();

}
}
function you()
{
$('.slideshow').prepend($('<img class="slideshowimage" src="'+images[nextimage++]+'" style="display:none">').fadeIn(500,function(){setTimeout(doSlideshow,1000);}));
if(nextimage>=images.length)
nextimage=0;
}
</img></script>
<style>
.slideshow
{
position: relative;
width: 350px;
height: 150px;
}
.slideshow img
{
position: absolute;
width: 350px;
height: 150px;
z-index: -1;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="slideshow">

</div>

</form>
</body>
 
Share this answer
 
v3

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900