Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   функция повторения предложений (https://javascript.ru/forum/jquery/65120-funkciya-povtoreniya-predlozhenijj.html)

Bossiks07 28.09.2016 00:25
функция повторения предложений
 
Сломал голову...
Не получается сделать так, чтобы список снова и снова повторялся.

Проблема в этой строке: setTimeout(function() {textChange(arr[i]);}, 1000) ; ?????

function textChange(change_text) {
 $('#elem').animate({'opacity': 0.2}, 4000, function() {
  $('#elem').html(change_text) ;
  $('#elem').animate({'opacity': 0.6}, 4000, function() {
   if(++i==arr.length) return ;
   setTimeout(function() {
    textChange(arr[i]) ;
   }, 1000) ;
  }) ;
 }) ;
} ;
var i = 0 ;
var arr = ["Контроль по обеспечению безопасности виртуального пространства и личной информации"] ;
setTimeout(function() {textChange(arr[i]);}, 1000) ;


<div id="elem" style="width: 50%; margin: 0 auto; text-align: center;">Мы предлагаем: Индивидуальное консультирование каждого клиента</div>

рони 28.09.2016 00:27
Bossiks07,
а что хочешь сделать то?

Bossiks07 28.09.2016 00:33
Цитата:
Сообщение от рони (Сообщение 430078)
Bossiks07,
а что хочешь сделать то?
Чтобы повторялось по кругу.
В данной ситуации доходит до предложения: Контроль по обеспечению безопасности виртуального пространства и личной информации. и на этом останавливается ротация.

Bossiks07 28.09.2016 00:40
function textChange(change_text) {
$('#elem').animate({'opacity': 0.2}, 4000, function() {
$('#elem').html(change_text) ;
$('#elem').animate({'opacity': 0.6}, 4000, function() {
if(++i==arr.length) return ;
setTimeout(function() {
textChange(arr[i]) ;
}, 1000) ;
}) ;
}) ;
} ;
var i = 0 ;
var arr = ["Контроль по обеспечению безопасности виртуального пространства и личной информации"] ;
setTimeout(function() {textChange(arr[i]);}, 1000) ;
var i ({repeat: true});

так получается?

рони 28.09.2016 00:44
Bossiks07,
http://javascript.ru/forum/jquery/48...tml#post322197

Bossiks07 28.09.2016 00:55
Цитата:
Сообщение от рони (Сообщение 430082)
Спасибо!!!!

рони 28.09.2016 01:04
бесконечная смена текста
 
Bossiks07,
вариант на основе примера выше по ссылке ...
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
   #elem{
     width: 50%; margin: 0 auto; text-align: center;}

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script>
$(function() {
    var b = ["Контроль по обеспечению безопасности виртуального пространства и личной информации",
    "Мы предлагаем: Индивидуальное консультирование каждого клиента"],
        c = $("#elem");
    (function d(a) {
        a = ++a % b.length;
        c.html(b[a]).fadeIn(1000).delay(5000).fadeOut(1000, function() {
            d(a)
        })
    })(-1)
});
  </script>
</head>

<body>
<div id="elem" ></div>

</body>
</html>

Pavel M. 29.09.2016 17:14
анимацию, если сильно старые браузеры не нужны удобно крутить и на css
<!DOCTYPE html>
<html>
<head>
  <style>
    @keyframes show {
      from {opacity:0}
      10% {opacity:1}
      40% {opacity:1}
      50% {opacity:0}
      to {opacity:0}
    }
    .elem {
         position: relative;
         height: 100px;
    }
    .elem span {
        animation: show 10s infinite;
        position: absolute;
        text-align: center;
        width: 50%;
        left: 25%;
        top: 0;
    }
    .elem span:nth-child(2) {
         animation-delay: -5s;
    }
  </style>
</head>
<body>
  <div class="elem">
    <span>Контроль по обеспечению безопасности виртуального пространства и личной информации</span>
    <span>Мы предлагаем: Индивидуальное консультирование каждого клиента</span>
  </div>
</body>
</html>


Часовой пояс GMT +3, время: 02:50.