Não fiz nenhum projeto recentemente, então aprendi o conhecimento do AngularJS no meu tempo livre e depois escrevi um exemplo de rolagem perfeita de texto, escrevendo principalmente uma pequena instrução.
Código CSS:
Estilo de controle principal
<style type = "text/css">*{margem: 0px; preenchimento: 0px;}. slide {width: 200px; altura: 200px; borda: 1px sólido #dcdcdc; margin: 0 Auto; margin-top: 50px; Overflow: Hidden;}.. 10px; font-tamanho: 16px; estilo de lista: nenhum; fundo de borda: 1px tracejado #dcdcdc; cursor: ponteiro;}. Slide li: hover {background: #ccc;} </style>Código HTML:
<corpo ng-app = "tip"> <div ng-controller = "tipcontroller"> <div> <ul> <!-diretiva-> <slide-follow siga id = "slide" dataset-data = "datasetdata"> </slide-follow>
Obviamente, nosso código é baseado no arquivo angular.js que foi introduzido na página.
Slide-sollow é a instrução que precisamos para implementar o conjunto de dados Data = "DataSetData" é o código JS de texto que precisamos para exibir
<script type = "text/javascript"> var app = angular.module ("tip", []); app.controller ("tipcontroller", function ($ scope) {// os dados podem ser substituídos de acordo com o seu próprio uso $ scope.datasetdAtA = [{{{ dados "}, {opção:" Este é o quarto dado "}, {opção:" Este é o quinto dado "}, {opção:" Este é o sexto dado "}]}). ng-repeat = 'Dados em DataSeTData'> {{data.option}} </li> ", link: function (escopo, elem, atts) {$ timeout (function () {var className = $ (". " + $ (elem) .parent () [0] .classname); ClassName.Children ("Li"). Comprimento; var liHeight = ClassName.Children ("Li"). Hight () + Parseint (ClassName.Children ("Li"). CSS ('Border-Bottom-Width'); ClassName.html (ClassName.html () + ClassName.HtMM; setInterval (slide, 4000); function slide () {if (parseInt (classname.css ("margin-top"))> (-lilength * liHeight)) {i ++; className.animate ({margintop: -liHeight * i+"px"}, "lento"); 0; ClassName.css ("margin-top", "0px");}} // Limpe o timer classeName.hover (function () {clearInterval (sh);}, function () {clearInterval (sh); sh = setInterval (slide, 4000);})}, 0)}}})Primeiro, definimos o texto a ser exibido no controlador e, em seguida, podemos começar a definir a seção de instruções.
Renderizações em execução:
O texto rolará perfeitamente para cima e para baixo. Quando o mouse for movido, o cronômetro será limpo e a rolagem será interrompida.
O acima é o código AngularJS que o editor apresentou a você para rolar perfeitamente o texto. Espero que seja útil para você. Se você tiver alguma dúvida, deixe -me uma mensagem e o editor responderá a você a tempo. Muito obrigado pelo seu apoio ao site wulin.com!