How to apply this scroll function? [closed]

Question

How to apply this scroll function? [closed]

Navigation

#1 by (3 votes)

0

I'd like to apply an effect that worked the following way, a search on the form that when it was displayed the result on the page should automatically scroll in place of the div where the search result will be.

Please note: Can anyone show me an example of how to do this ??

This is part code that displays the results, how to deploy this javascript function in this code:

if ($resultados->num_rows > 0) {
    while($linha = mysqli_fetch_array($resultados)) {
        echo utf8_encode("<strong>Nome: </strong>" ."<strong>". $linha['nome']."</strong>" . "</br>");
        print ("<strong>Endereço: </strong>" . $linha['endereco'] . "</br>");
        if (isset($_POST['cidade']) && $_POST['cidade'] === 'sao-gabriel-da-palha') {
            $fromPerson = 'São Gabriel da Palha';
            echo "<strong>Cidade: </strong>" . $fromPerson . "</br>";
        }
        print ("<strong>Telefone: </strong>" . $linha['telefone'] . "</br>");
        echo "<strong>email: </strong>" . $linha['email'] . "</br>";
        if (isset($_POST['palavra'])) { // remover acentos
            $palavra = preg_replace("/&([a-z])[a-z]+;/i", "$1", htmlentities(strtolower(trim($_POST['palavra']))));
        }
        if (!empty($palavra) &&
            in_array($palavra, array('andrey ferraz', 'andrey', 'ferraz', 'andrey martins ferraz'))){
            require 'andreyferraz.php';
        }

    } }else{
   echo "<h3 align='center'>Empresa ainda não cadastrada!</h3>";

javascript rolamento

asked by anonymous 16.10.2017 / 18:04

1 answer

Show content in the desktop version and hide it in the mobile version. And vice versa [duplicate] What is wrong with my thread using synchronized - Java

score 3 · Answer 1

Your question is too broad but I think that's what it is ...

$('#search').click(function () {
  var el = $('#' + $('#param').val() );

  if(el != "undefined") {
    $('html, body').animate({
		        scrollTop: $( el ).offset().top
		        }, 500); // Tempo em ms que a animação irá durar
  }
		    
		});

div {
padding: 30px;
background-color: #444;
color: white;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><inputid="param" type="text">
    <input id="search" value="pesquisar" type="button">
    
    <div id="teste1">teste1</div>
    <div id="teste2">teste2</div>
    <div id="teste3">teste3</div>
    <div id="teste4">teste4</div>
    <div id="teste5">teste5</div>
    <div id="teste6">teste6</div>
    <div id="teste7">teste7</div>
    <div id="teste8">teste8</div>