How To Create Slide Show Images in asp.net using jquery
Steps for asp.net
=================
1)open webapplication
2)In solution explorer create images folder.
3)take stylesheet and add link in head section.
4)write javascript fucntion for slideshow using jqery
5)after call class in the div section and also write url for images.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script src="jquery-1.4.1.js" type="text/javascript"></script>
<script src="jquery.cycle.all.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function()
{
$(".slideshow").cycle({fx:"fade"});
});
</script>
<title>SlideShow</title>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form id="form1" runat="server">
<div align="center">
<div id="body" class="slideshow">
<img src="images/addnewuser.jpeg" width="780" height="294" />
<img src="images/cancel.jpeg" width="780" height="294" />
<img src="images/delete.jpeg" width="780" height="294" />
<img src="images/edit.jpeg" width="780" height="294" />
<img src="images/right.jpeg" width="780" height="294" />
<img src="images/update.jpeg" width="780" height="294" />
</div>
</div>
</form>
</body>
</html>
</div>
Steps for asp.net
=================
1)open webapplication
2)In solution explorer create images folder.
3)take stylesheet and add link in head section.
4)write javascript fucntion for slideshow using jqery
5)after call class in the div section and also write url for images.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script src="jquery-1.4.1.js" type="text/javascript"></script>
<script src="jquery.cycle.all.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function()
{
$(".slideshow").cycle({fx:"fade"});
});
</script>
<title>SlideShow</title>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form id="form1" runat="server">
<div align="center">
<div id="body" class="slideshow">
<img src="images/addnewuser.jpeg" width="780" height="294" />
<img src="images/cancel.jpeg" width="780" height="294" />
<img src="images/delete.jpeg" width="780" height="294" />
<img src="images/edit.jpeg" width="780" height="294" />
<img src="images/right.jpeg" width="780" height="294" />
<img src="images/update.jpeg" width="780" height="294" />
</div>
</div>
</form>
</body>
</html>
</div>
No comments:
Post a Comment