C # - Scroll JS / JQuery after an OnClick event

0

I have a linkbutton with an onClick event that does something in code behind, but I would like it when I return to execute the on click event, there would be a javascript that would move the scroll to a particular div.

I do not have much idea of js, I was investigating it on my own the last 24hrs but I do not hit the nail on the head.

Any ideas?

Thank you.

Edit: Hi, thanks for answering, I'm adding an example code:

HTML:

<html><head></head>
<body>
<asp:LinkButton ID="lb1" runat="server" OnClick="lb1_Click"> Click Aqui </asp:LinkButton>

<!--Aqui imaginemos que hay una imagen que es muy grande, y mucho mas abajo mi div-->

<div id=miDiv> Hola </div>

</body>
</html>

Code Behind:

protected void lb1_Click(object sender, EventArgs e)
{
     //aqui hago algunas cosas, lleno un repeater, y otras cosas
     //y quiero que luego de ejecutar este codigo, el html scrolée
    //hasta el div de id=miDiv

}
    
asked by Facundo Díaz 23.09.2018 в 14:48
source

1 answer

0

Edit: Sorry, I had written before reading your edition ... I do not know where you should put the js / jquery code, but I'm sure they can help you around here ... even so I leave the answer in case it can be useful .

I can give you a solution if you use jQuery . The method you are looking for is scrollTop() . Within the parentheses is the number of pixels from the beginning of the document to where the scroll will be positioned.

In your case you should use the offset().top method to get back this number of pixels from the particular div. (The offset () method returns an object with top and left properties, by putting ".top" behind we get the value of this property in particular)

For example:

$(document).scrollTop($('#idDelDivEnParticular').offset().top);

This line will position you in the div in question instantaneously, if you want instead to make a progressive transition you can use the animate() method with the scrollTop property, for example like this:

$('html').animate({scrollTop: $('#idDelDivEnParticular').offset().top}[,'slow'][,'linear']);

I put the brackets to indicate that it is optional, but if you put it, you obviously do not use the brackets. Where it says "'slow'" you can use a number in milliseconds, 'slow' is equivalent to 600 (0'6 seconds), 'fast' (200 ms), 4000 (4 seconds, etc. There is also a hidden property for the type of movement that by default is 'swing' and you can change to 'linear', adding it behind or closing the parentheses after the key without adding anything and using the default values that are 400 and 'swing'. a function after the animation, writing it at the end or calling it.

    
answered by 23.09.2018 в 17:31