A method of dynamic change of Web page background image in jquery

  This article mainly introduces jquery dynamic replacement of Web page background image method, the need for friends can refer to the following

Sometimes, we can provide users with very intimate functions, such as to determine when the user is to visit, and then give a greeting, good evening, good afternoon and so on. and change the background color of the Web page, such as night when you can use the background of the stars, daytime with the sun shining, or a specific holiday on the theme of the background, so that your site appears very flexible, not boring.   Here is a workaround for how to implement a background change:   How to implement   very simple, here is the JQuery code:     Code as follows: function dochangebkg () { var BK gurl=$ ("#inputBkgUrl"). Val ();  var repeatemode=$ ("#inputRepeatMode"). Val ();  var s= "<style type= ' text/css ' > body{background-repeat:" +repeatemode+ "Background-image:url (" "+bkgUrl+ ""); } </style> ";  $ ("#outputDiv"). HTML (s); }     native JavaScript code:     Code as follows: function dochangebkg () { var bkgurl=$ ("#inputBkgUrl"). Val (); &nb Sp;var repeatemode=$ ("#inputRepeatMode"). Val ();  var s= "<style type= ' text/css ' > body{background-repeat:" +repeatemode+ "Background-image:url (" "+bkgUrl+ ""); } </style> ";  $ ("#outputDiv"). HTML (s);     Front-end code:   Code: <div>  background picture url:<input type= "text" size= "a" id= "Inputbkgurl"/> <br /> background picture repeat way: <select id="Inputrepeatmode" ><option value= "Repeat" selected= "selected" >repeat</option><option value= " No-repeat ">no-repeat</option><option value=" repeat-x ">repeat-x</option><option value=" Repeat-y ">repeat-y</option></select>  <input type=" button "onclick=" dochangebkg () "Value=" Confirm Replacement "/>  </div>  <div id=" Outputdiv "></div>