[javascript] 텍스트 깜박임 jQuery
jQuery에서 텍스트 깜박임을 만드는 쉬운 방법과 중지하는 방법은 무엇입니까? IE, FF 및 Chrome에서 작동해야합니다. 감사
답변
예를 들어
$('.blink').blink(); // default is 500ms blink interval.
//$('.blink').blink(100); // causes a 100ms blink interval.
또한 매우 간단한 플러그인이며 애니메이션을 중지하고 요청시 시작할 수 있도록 확장 할 수 있습니다.
답변
일부 텍스트를 깜박이는 플러그인은 나에게 과잉처럼 들립니다 …
이 시도…
$('.blink').each(function() {
var elem = $(this);
setInterval(function() {
if (elem.css('visibility') == 'hidden') {
elem.css('visibility', 'visible');
} else {
elem.css('visibility', 'hidden');
}
}, 500);
});답변
여기에 애니메이션이 깜박입니다.
$(".blink").animate({opacity:0},200,"linear",function(){
$(this).animate({opacity:1},200);
});깜박이고 싶은 것이 무엇이든 깜박임 클래스를 제공하십시오.
<div class="someclass blink">some text</div>#jquery의 DannyZB에 대한 모든 안부
풍모:
- 플러그인이 필요하지 않습니다 (그러나 JQuery 자체)
- 일을한다
답변
jQuery를 사용하지 않으려면 CSS3를 사용하면됩니다.
@-webkit-keyframes blink {
from { opacity: 1.0; }
to { opacity: 0.0; }
}
blink {
-webkit-animation-name: blink;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: cubic-bezier(1.0,0,0,1.0);
-webkit-animation-duration: 1s;
}Chrome에서 작동하는 것 같지만 약간의 흐느끼는 소리가 들린다 고 생각했습니다.
답변
위의 코드를 결합하면 이것이 좋은 해결책이라고 생각합니다.
function blink(selector){
$(selector).animate({opacity:0}, 50, "linear", function(){
$(this).delay(800);
$(this).animate({opacity:1}, 50, function(){
blink(this);
});
$(this).delay(800);
});
}적어도 내 웹에서 작동합니다.
http://140.138.168.123/2y78%202782
답변
여기 내 것이 있습니다. 중요한 3 가지 매개 변수를 제어 할 수 있습니다.
- 페이드 인 스피드
- 페이드 아웃 속도
- 반복 속도
.
setInterval(function() {
$('.blink').fadeIn(300).fadeOut(500);
}, 1000);답변
표준 CSS 방식을 사용할 수도 있습니다 (JQuery 플러그인이 필요하지 않지만 모든 브라우저와 호환 가능).
// Start blinking
$(".myblink").css("text-decoration", "blink");
// Stop blinking
$(".myblink").css("text-decoration", "none");