2014-02-06 4 views
0
#player #title{ 
left: 90px; 
width: 200px; 
overflow: hidden; 
} 

Текст, присутствующий в этом конкретном div (#Title), должен быть шатер. Но в HTML не должно быть никаких изменений (разрешен только java-скрипт). Как действовать? Просьба помочь нам ...Текст, присутствующий внутри этого фрагмента div, должен быть выделен

+0

Возможный дубликат http://stackoverflow.com/questions/10547797/very-simple-very-smooth-javascript-marquee – Kushal

ответ

0

Если текст известен и никогда не изменится, вы могли бы использовать некоторые CSS3: переход и текст-тень и сделать его слайд с текстом отступа, например:

p { 
    text-shadow:35em 0 0;/* equal to length of text */ 
    width:15em; 
    white-space:nowrap; 
    overflow:hidden; 
animation: marqueeme 3s infinite; 
    margin:auto; 
    background:yellow; 
    border:solid red; 
} 
@keyframes marqueeme { 
    to {text-indent:-35em; 
} 

<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p> Смотрите и проверить: http://codepen.io/gc-nomade/pen/wGtmy

Вы должны использовать EM значения для MATC h с текстовым размером, вам также может понадобиться сбросить расстояние между буквами. Он может сломаться, если текст изменится или с некоторыми шрифтами.

0

http://jsfiddle.net/4mTMw/8/

<div class='marquee'> 
    <div class='marquee-text'> 
     Testing this marquee function 
    </div> 
</div> 
<script> 
    var marquee = $('div.marquee'); 
    marquee.each(function() { 
     var mar = $(this),indent = mar.width(); 
     mar.marquee = function() { 
      indent--; 
      mar.css('text-indent',indent); 
      if (indent < -1 * mar.children('div.marquee-text').width()) { 
       indent = mar.width(); 
      } 
     }; 
     mar.data('interval',setInterval(mar.marquee,1000/60)); 
    }); 
</script> 
+0

Спасибо за ваш ответ. Мой html-код ...

Title Goes here
Но изменений HTML не должно быть. – Joshua

Смежные вопросы