Redirect with href and move to html section

Question

Redirect with href and move to html section

Navigation

#1 by (1 votes)

1

Hi, I would like to know if it is possible to redirect to an aspx and move to a section of this same but at the same time by means of href="# ..." currently I have two pages .aspx with a menu, but when I go to the second and want to return, this only redirects me to the first .aspx and I do with the href="" in this way and with this script:

<li><a href="#" onclick="Redirect();">Pagina 2</a></li>

    <script>
       function Redirect()
       { location.href = "Inicio.aspx"; }
    </script>

So far so good, but in addition to this I would like that after addressing the function "skip" as shown in the example:

function saltarA(id, tiempo) {
  var tiempo = tiempo || 1000;
  $("html, body").animate({ scrollTop: $(id).offset().top }, tiempo);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div>
<ul>
  <li><a href="javascript:saltarA('#seccion')">Pagina 1</a></li>
  <li><a href="#" onclick="Redirect();">Pagina 2</a></li>
</ul>
</div>
<p><strong>Pagina 1</strong></p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<p>a</p>
<section id="seccion">
<p><strong>Despues de ser redireccionado, quisiera que se transporte hasta este punto de mi pagina 1</strong></p>
</section>

jquery html script href link

asked by Juan Fernando Dj Jf 16.04.2018 в 06:32

source

1 answer

Hide forms in Laravel 5.5 only visually How to configure CAS with MySQL (or another DB)?

score 1 · Answer 1

If you want to redirect to another aspx and the scroll is placed in a certain position, just add the symbol # followed by the id of the element that is in the desired position at the end of the link.

location.href="Inicio.aspx#seccion":

Considering your comment, if you prefer the movement to be animated, you can send the id as a parameter:

location.href="Inicio.aspx?id=seccion":

And then in the event ready read that parameter and call your function saltarA

$(document).ready(function(){
       var id = getUrlParameter('id'); //Ver link para obtener ésta función
       saltarA("#"+id, 500);
});

Link to see function that gets URL parameters: link

In Start.aspx the script would be:

$(document).ready(function () {
     var id = getUrlParameter('id'); 
     saltarA("#" + id, 500);
});

function saltarA(id, tiempo) {
     var tiempo = tiempo || 1000;
     var section = $("html, body").animate({ scrollTop: $(id).offset().top }, tiempo);
}

And in the other aspx:

function Redirect() {
     location.href = "Inicio.aspx?id=about";
}