Scrolling when click on side arrow

Jan 28 2020 12:28 PM

Hello Members,

Hope you are doing good!!

Here am implementing the scroling event when click on side arrow...

In the fiddler it is working(here is the reference http://jsfiddle.net/PAw8q/10/)

But when i am trying to implement in VS, The click event is not taking place

Here is the code. Can anyone guide me..

Thank you in advance!!

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Scrool.Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.bloc_1_edito{width: 967px;background-color: #bbbbbb;height: 366px;
margin:0 auto;position: relative}
#nav_container {
z-index: 10000;
bottom: 0px;
background-color: rgba(181, 174, 5, 0.4);
position: absolute;
height: 80px;
overflow: hidden;
width: 500px;
white-space: nowrap;
}
.image_thumbnails{width: 116px;height: 65px;}
#prev_nav{position: absolute;
left: 5px;font-size:20px;font-family: 'avantgarde_medium';
font-weight: bold;top:30px;color: blacks;cursor: pointer;z-index: 1000;}
#next_nav{position: absolute;
right: 5px;font-size:20px;font-family: 'avantgarde_medium';
font-weight: bold;top:30px;color: black;cursor: pointer;z-index: 1000;}
#nav{
position: absolute;
width: 500px;
overflow: hidden;
}
#nav li { width: 116px; height:65px; display: inline-block;
margin: 10px 5px 8px 33px;list-style: none }
#nav a { width: 116px; height:65px; display: block; }
#nav li.activeSlide a {}
#nav a:focus { outline: none; }
#nav img { border: none; display: block }
</style>
<script type= "text/javascript">
$('#next_nav').click(function () {
$( "#nav" ).animate({
scrollLeft: '+=156px'
});
});
$('#prev_nav').click(function () {
$( "#nav" ).animate({
scrollLeft: '-=156px'
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div class="bloc_1_edito">
<div id="nav_container">
<div id="next_nav">></div>
<div id="prev_nav"><</div>
<div id="nav">
<li class="activeSlide">
<a href="#">
<img class="image_thumbnails" src="http://galaxyfoot.soixanteseize-lab.com/wp-content/uploads/image_edito1.jpg"></img>
</a>
</li>
<li>
<a href="#">
<img class="image_thumbnails" src="http://img.youtube.com/vi/yjtqkQFAn5U/0.jpg"></img>
</a>
</li>
<li>
<a href="#">
<img class="image_thumbnails" src="http://img.youtube.com/vi/KNz01ty-kTQ/0.jpg"></img>
</a>
</li>
<li>
<a href="#">
<img class="image_thumbnails" src="http://galaxyfoot.soixanteseize-lab.com/wp-content/uploads/test_2_slider.jpg"></img>
</a>
</li>
<li>
<a href="#">
<img class="image_thumbnails" src="http://img.youtube.com/vi/hn0wAloRrMM/0.jpg"></img>
</a>
</li>
<li>
<a href="#">
<img class="image_thumbnails" src="http://galaxyfoot.soixanteseize-lab.com/wp-content/uploads/the-order-1886-012814-3-650x366.jpg"></img>
</a>
</li>
<li>
<a href="#">
<img class="image_thumbnails" src="http://galaxyfoot.soixanteseize-lab.com/wp-content/uploads/jpg_650x366_bluegrass.png"></img>
</a>
</li>
<li>
<a href="#">
<img class="image_thumbnails" src="http://galaxyfoot.soixanteseize-lab.com/wp-content/uploads/c…-scientifique-Canyons-Mediterranee-ROV-650x366_reference.jpg"></img>
</a>
</li>
<li>
<a href="#">
<img class="image_thumbnails" src="http://img.youtube.com/vi/syzS14qzfMA/0.jpg"></img>
</a>
</li>
</div>
</div>
</div>
</form>
</body>
</html>

Answers (4)

can any one share me asp c# code to mention sql asp c# code

SqlDataAdapter Update Functionality