Last post Mar 22, 2017 05:50 PM by arwa55
Member
22 Points
112 Posts
Mar 20, 2017 08:33 PM|arwa55|LINK
hiii everyone
im working on this gallery which takes its images from my database all good
https://www.w3schools.com/w3css/w3css_slideshow.asp
im trying to do the one that have circle indicater but the indicater wont appear i tied it to the id of the images in the database
<asp:ObjectDataSource ID="ObjectDataSource1" runat="server" SelectMethod="GetDatagallery" TypeName="galleryBLL"></asp:ObjectDataSource> <asp:Repeater ID="Repeater1" runat="server" DataSourceID="ObjectDataSource1"> <ItemTemplate> <div class="mySlides"> <asp:Image ID="Image1" runat="server" ImageUrl='<%# Eval("image") %>' width="100%" Height="400px" /> <h2 style="position:absolute;top:20px">what</h2> <a href="#">hiii</a> </div> <div class="w3-center w3-display-bottommiddle" style="width:100%;position:absolute;top:-20px" > <div class="w3-center w3-display-bottommiddle" style="width:100%"> <span class="w3-badge demo w3-border" onclick="currentDiv("+ <%# Eval("Id") %> +")"></span> </div> </div> </ItemTemplate> </asp:Repeater> <script> var slideIndex = 1; showDivs(slideIndex); function plusDivs(n) { showDivs(slideIndex += n); } function currentDiv(n) { showDivs(slideIndex = n); } function showDivs(n) { var i; var x = document.getElementsByClassName("mySlides"); var dots = document.getElementsByClassName("demo"); if (n > x.length) { slideIndex = 1 } if (n < 1) { slideIndex = x.length } for (i = 0; i < x.length; i++) { x[i].style.display = "none"; } for (i = 0; i < dots.length; i++) { dots[i].className = dots[i].className.replace(" w3-white", ""); } x[slideIndex - 1].style.display = "block"; dots[slideIndex - 1].className += " w3-white"; } </script>
anyone have idea wats wrong i think the code is ok
All-Star
48280 Points
17983 Posts
Mar 20, 2017 09:55 PM|PatriceSc|LINK
Hi,
What do you see when using "view source" in your browser for your onclick event?
Mar 21, 2017 11:21 AM|arwa55|LINK
hiii thanku for ur reply this is how it shows in viewsource
<div class="w3-content w3-display-container" style="max-width:800px"> <div class="mySlides"> <img id="Repeater1_Image1_0" src="../uploads/ads1.jpg" style="height:400px;width:100%;" /> <h2 style="position:absolute;top:200px;left:100px;color:white;font-size:28px;">The Best Advertisment</h2> <input type="submit" name="Repeater1$ctl00$Button1" value="Button" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("Repeater1$ctl00$Button1", "", false, "", "../services.aspx", false, false))" id="Repeater1_Button1_0" style="position:absolute;top:280px;left:100px;" /> </div> <div class="w3-center w3-container w3-section w3-large w3-text-white w3-display-bottommiddle" style="width:100%"> <span class="w3-badge demo w3-border" onclick="currentDiv("+ 1 +")"></span> </div> </div> <div class="w3-content w3-display-container" style="max-width:800px"> <div class="mySlides"> <img id="Repeater1_Image1_1" src="../uploads/ads2.jpg" style="height:400px;width:100%;" /> <h2 style="position:absolute;top:200px;left:100px;color:white;font-size:28px;">The Best Advertisment</h2> <input type="submit" name="Repeater1$ctl01$Button1" value="Button" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("Repeater1$ctl01$Button1", "", false, "", "../services.aspx", false, false))" id="Repeater1_Button1_1" style="position:absolute;top:280px;left:100px;" /> </div> <div class="w3-center w3-container w3-section w3-large w3-text-white w3-display-bottommiddle" style="width:100%"> <span class="w3-badge demo w3-border" onclick="currentDiv("+ 2 +")"></span> </div> </div> <div class="w3-content w3-display-container" style="max-width:800px"> <div class="mySlides"> <img id="Repeater1_Image1_2" src="../uploads/ads3.jpg" style="height:400px;width:100%;" /> <h2 style="position:absolute;top:200px;left:100px;color:white;font-size:28px;">The Best Advertisment</h2> <input type="submit" name="Repeater1$ctl02$Button1" value="Button" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("Repeater1$ctl02$Button1", "", false, "", "../services.aspx", false, false))" id="Repeater1_Button1_2" style="position:absolute;top:280px;left:100px;" /> </div> <div class="w3-center w3-container w3-section w3-large w3-text-white w3-display-bottommiddle" style="width:100%"> <span class="w3-badge demo w3-border" onclick="currentDiv("+ 3 +")"></span> </div> </div>
Mar 21, 2017 12:05 PM|PatriceSc|LINK
Ok you create something such as :
onclick="currentDiv("+ 1 +")" which is not valid.
I would try rather something such as:
onclick='<%# Eval("Id","currentDiv({0})") %>' which should create onclick='currentDiv(1)' instead...
Then use F12 Console in your browser to spot possible remaining JavaScript errors. It was just the first thing I saw.
Mar 22, 2017 05:50 PM|arwa55|LINK
thankuuuu it did it
Member
22 Points
112 Posts
gallery with circle indicator
Mar 20, 2017 08:33 PM|arwa55|LINK
hiii everyone
im working on this gallery which takes its images from my database all good
https://www.w3schools.com/w3css/w3css_slideshow.asp
im trying to do the one that have circle indicater but the indicater wont appear i tied it to the id of the images in the database
anyone have idea wats wrong i think the code is ok
All-Star
48280 Points
17983 Posts
Re: gallery with circle indicator
Mar 20, 2017 09:55 PM|PatriceSc|LINK
Hi,
What do you see when using "view source" in your browser for your onclick event?
Member
22 Points
112 Posts
Re: gallery with circle indicator
Mar 21, 2017 11:21 AM|arwa55|LINK
hiii thanku for ur reply this is how it shows in viewsource
All-Star
48280 Points
17983 Posts
Re: gallery with circle indicator
Mar 21, 2017 12:05 PM|PatriceSc|LINK
Ok you create something such as :
onclick="currentDiv("+ 1 +")" which is not valid.
I would try rather something such as:
onclick='<%# Eval("Id","currentDiv({0})") %>' which should create onclick='currentDiv(1)' instead...
Then use F12 Console in your browser to spot possible remaining JavaScript errors. It was just the first thing I saw.
Member
22 Points
112 Posts
Re: gallery with circle indicator
Mar 22, 2017 05:50 PM|arwa55|LINK
thankuuuu it did it