3
I can think up two approaches.
Approach #1:
If your site is written with server-side language such as ASP.NET, you can implement it by the server-side scripts. After you get the data from database you create the jQuery slider HTML markup by the server side code, then render the page with the slider markup.
Approach #2:
- Suppose your page does not have the jQuery slider content when the page is launched. So you just add this markup in your page:<div id="mcts1"></div>And also add this JavaScript function for later use:<script type=”text/javascript”> function addSlides(str){ var sliderElm = document.getElementById(“mcts1”); sliderElm.innerHTML = str; } </script>
- Then your page is retrieving data from database;
- Then your code will build the slider markup string based on the retrieved data;
- Then you call the addSlides function by inserting this script to your page:
<script type=”text/javascript”> addSlides(‘<div class="textSlide"><p>HTML Slide</p>Text text text</div><img src="slide-5.jpg" />’); </script>If your page is ASP.NET, above code will be like below in the code behind:Page.ClientScript.RegisterStartupScript(this.GetType(), "myscript1", "<script type=\"text/javascript\"><div class=\"textSlide\"><p>HTML Slide</p>Text text text</div><img src=\"slide-5.jpg\" />script>");