Os esportes em JavaScript são frequentemente usados no site. Desta vez, vou compartilhar com você algumas aplicações básicas de esportes. É conveniente que todos usem diretamente durante o desenvolvimento.
O código é simples e fácil de entender e é adequado para iniciantes. Finalmente, vou resolver minha própria estrutura esportiva passo a passo.
Renderizações de casos de aplicação:
Mova o mouse para compartilhar e a div à esquerda será exibida. Remova e recupere sozinho. Eu acredito que todos vão usar isso muito prático. Vamos ver como o código é implementado.
A cópia do código é a seguinte:
<style type = "text/css">
#div1 {
Largura: 150px;
Altura: 200px;
Antecedentes: verde;
Posição: Absoluto;
Esquerda: -150px;
}
#div1 span {
Posição: Absoluto;
Largura: 20px;
Altura: 60px;
altura de linha: 20px;
Antecedentes: azul;
Direita: -20px;
TOP: 70px;
}
</style>
A cópia do código é a seguinte:
<Body>
<div id = "div1">
<pan>
Compartilhar para
</span>
</div>
</body>
A seguir, o código JavaScript
A cópia do código é a seguinte:
<script type = "text/javascript">
window.onload = function () {
var odiv = document.getElementById ("div1");
odiv.onMouseOver = function () {
startMove (0);
};
odiv.onMouseOut = function () {
startMove (-150);
};
}
var time = null;
função startmove (itraget) {
var odiv = document.getElementById ("div1");
ClearInterval (tempo);
time = setInterval (function () {
var velocidade = 0;
if (odiv.offsetleft> itraget) {
velocidade = -10;
}outro{
velocidade = 10;
}
if (odiv.OffSetLeft == ITRAGET) {
ClearInterval (tempo);
}outro{
odiv.style.left = odiv.offsetleft+velocidade+'px';
}
}, 30);
}
</script>
Ideias:
A esquerda inicial no estilo é -150. A div é encolhida por dentro e será exibida se dada 0. Então precisamos alterar esse valor
O parâmetro Itarget no StartMove é o ponto de destino, indicando qual ponto de destino você vai parar.
Controlar o tamanho da velocidade pode controlar a velocidade do movimento. Se o ponto alvo for atingido, pare o timer.
lei:
* Suposição
* Esquerda: 30 ITARGET: 300 é obtido como positivo para a direita
* Esquerda: 600 itetget: 50 é negativo para a esquerda
*
* A relação entre a posição atual esquerda e o ponto de alvo Itarget infere a velocidade positiva e negativa
Nota: O timer deve ser desligado assim que você começar, porque toda vez que você se move para compartilhar, um temporizador será ativado. Quanto mais você ligar, mais rápida será a velocidade, porque haverá vários temporizadores para executar ao mesmo tempo.
Portanto, cada vez que você deve garantir que um temporizador funcione.
Siga: a mesma função da função, quanto menos parâmetros, melhor, de acordo com as regras acima, a velocidade não é passada como parâmetros.
Para dar um exemplo na vida: geralmente é impossível pegar um táxi e dizer ao motorista de táxi que ele tem 100 metros para ir aonde quer que tenha chegado. Você não pode dizer ao mestre como você quer correr
Portanto, o programa é o mesmo, portanto o parâmetro de velocidade é removido aqui.
Obviamente, haverá muitos problemas com a estrutura esportiva atual, que será resolvida um após o outro no futuro. No próximo artigo, vamos discutir como interromper o movimento uniforme.