I am currently working on my asp.net website and I would like to incorporate an image slideshow as the background of my homepage. This idea was inspired by a site I came across, . I have successfully implemented the slideshow, but now I am wondering if it is possible to set it as the background. Can anyone help me achieve this?
Here is a snippet of my slideshow code:
<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="HOME.aspx.cs" Inherits="webforms_Default" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<div>
<link href="../css%20pages/home.css" rel="stylesheet" />
<style type="text/css">
#s_show {
border-style: none;
border-color: inherit;
border-width: 5px;
position:relative;
height:349px;
background-color:#000;
top: 2px;
left: 67px;
width: 1013px;
}
#s_show IMG {
border-style: none;
border-color: inherit;
border-width: 5px;
position:absolute;
top:4px;
left:2px;
z-index:8;
opacity:0.0;
height: 342px;
width: 1008px;
}
#s_show IMG.active {
z-index:10;
opacity:1.0;
}
#s_show IMG.last-active {
z-index:9;
}
</style>
<script src="../Scripts/jquery-2.0.2.min.js"></script>
<script type="text/javascript">
function slideShow() {
var $active = $('#s_show IMG.active');
if ($active.length == 0) $active = $('#s_show IMG:last');
var $next = $active.next().length ? $active.next()
: $('#s_show IMG:first');
$active.addClass('last-active');
$next
.css({ opacity: 0.0 })
.addClass('active')
.animate({ opacity: 1.0 }, 500, function () {
$active.removeClass('active last-active');
});
}
$(function () {
setInterval("slideShow()", 5000);
});
</script>
</div>
<h1 style="color: black">WELCOME TO THE HERITAGE ACADEMY
</h1>
<h3 style="width: 436px; margin-left: 360px; height: 74px;"><em style="color: black">
<br />
THE PLACE WHERE EDUCATION IS NOT A PART OF LIFE....<br />
IT IS LIFE ITSELF....!!!!<br />
</em></h3>
<div id="s_show">
<img src="../pics%20for%20site/001.gif" />
<img src="../pics%20for%20site/002.JPG" />
<img src="../pics%20for%20site/003.jpg" />
<img src="../pics%20for%20site/banner_new.jpg" />
<img src="../pics%20for%20site/about-us-vission-mission.jpg" />
<img src="../pics%20for%20site/8458__7217__8154758.jpg" />
</div>
<p style="color: #FFFFFF; width: 1079px;"><strong> <span class="auto-style2"> </span><span class="auto-style3">
<br />
<br />
<br />
Since inception in 2007, the Academy has developed its base of highly accomplished faculty, world-class infrastructure, and motivated student body to emerge as one of the premier institutes offering a first-degree course in the state. Within just five years, the academy has made a mark by organizing several seminars and panel discussions on current national and international issues. It has also achieved academic excellence through outstanding performance in university examinations.<br />
<br />
<br />
</span></strong></p>
</asp:Content>