javascript - How to make background images stretch and change every 3 seconds in asp.net -


i trying make slide show background image. code far:

    <script type = "text/javascript">           function displaynextimage() {               x = (x === images.length - 1) ? 0 : x + 1;               document.getelementbyid("img").src = images[x];           }            function displaypreviousimage() {               x = (x <= 0) ? images.length - 1 : x - 1;               document.getelementbyid("img").src = images[x];           }            function starttimer() {               setinterval(displaynextimage, 3000);           }            var images = [], x = -1;           images[0] = "assets/images/image1.jpg";           images[1] = "assets/images/image2.jpg";           images[2] = "assets/images/image3.jpg";     </script>  </head> <body>     <form id="form1" runat="server">     <div id="centercontents"  onload = "changeimage()">         <%-- write here --%>           <img id="img" src="assets/images/image3.jpg">         <button type="button" onclick="displaypreviousimage()">previous</button>        <button type="button" onclick="displaynextimage()">next</button>          <%-- dont write lower --%>     </div>     </form> </body> 

i trying change code image function:
setinterval(displaynextimage, 3000);

but not working. suggestions?

also, how can set image stretch?
used background-size: cover
not working. suggestions?

to stretch image add width: 100%; , automate image change add

in javascript

 <script> document.addeventlistener("domcontentloaded", function(event) { starttimer(); }); </script> 

Comments

Popular posts from this blog

php - How to display all orders for a single product showing the most recent first? Woocommerce -

asp.net - How to correctly use QUERY_STRING in ISAPI rewrite? -

angularjs - How restrict admin panel using in backend laravel and admin panel on angular? -