私は最近プロジェクトを行っていないので、暇なときにAngularjsの知識を学び、主に小さな指示を書くテキストのシームレスなスクロールの例を書きました。
CSSコード：
メインコントロールスタイル
<style type = "text/css">*{margin：0px; padding：0px;}。スライド{width：200px; height：200px; border：1px solid #dcdcdc; margin：0 auto; margin-top：50px; overflow：hidden;}。 10px; font-size：16px; list-style：none; border-bottom：1px dashed #dcdcdc; cursor：pointer;}。スライドli：hover {background：#ccc;} </style>HTMLコード：
<body ng-app = "tip"> <div ng-controller = "tipcontroller"> <div> <ul> <！ - directive-> <slide-follow id = "slide" dataset-data = "datasetdata"> </slide-follow> </ul> </div> </</<
もちろん、私たちのコードは、ページに導入されたAngular.jsファイルに基づいています。
Slide-Followは、DataSet-Data = "DataSetData"を実装するために必要な命令です。
<script type = "text/javascript"> var app = angular.module（ "tip"、[]）; app.controller（ "tipcontroller"、function（$ scope）{//データは$ scope.datasetdata = [{{{{this option： "opt op option：" "option：" option " data "}、{オプション："これは4番目のデータ "}、{オプション："これは5番目のデータ "}、{"これは6番目のデータです "}]}） "<li ng-repeat = 'datasetdata'> {{data.option}} </li>"、link：function（scope、elem、attrs）{$ timeout（var class（）{var classname = $（ "。" + $（elem）.parent（）[0]; var i = 0; var i = 0、sh; var i = 0、sh; var i = 0 classname.children（ "li"）。長さ; var liheight = classname.children（ "li"）。height（） + parseint（classname.children（ "li"）。 setInterval（Slide、4000）; function slide（）{if（parseint（classname.css（ "margin-top"））>（-lilenged * liheight））{i ++; classname.anime（{margintop：-liheight * i+"px"}、 "slow"）; 0; classname.css（ "margin-top"、 "0px"）;}} // clear timer classname.hover（function（）{clearinterval（sh）;}、function（）{clearinterval（sh）; sh = setinterval（slide、4000）;}）}}、0）}}）</scrip>最初に、コントローラーに表示されるテキストを定義し、次に命令セクションの定義を開始できます。
ランニングレンダリング：
テキストはシームレスに上下にスクロールします。マウスが移動すると、タイマーがクリアされ、スクロールが停止します。
上記は、編集者がテキストをシームレスにスクロールするために紹介したAngularJSコードです。それがあなたに役立つことを願っています。ご質問がある場合は、メッセージを残してください。編集者は時間内に返信します。 wulin.comのウェブサイトへのご支援ありがとうございます！