آموزش ساخت متن چشمک زن با Css :
با استفاده از کد زیر متن مورد نظر شما تنها در مرورگرهای گوگل کروم و موزیلا فایرفاکس به نمایش در خواهد آمد.
برای اینکار از کدهای Css زیر استفاده نمایید :
|
۱
۲
۳
۴
۵
۶
۷
۸
۹
۱۰
|
@-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;
}
|
حال برای ساخت متن چشمک زن از تگ blink استفاده می کنیم که از کد زیر استفاده نمایید :
|
۱
|
|
|
1
2
3
4
5
6
7
8
9
|
function doBlink() {
var blink = document.all.tags("blink")
for (var i=0; i blink[i].style.visibility = blink[i].style.visibility == "" ? "hidden" : ""
}
function startBlink() {
if (document.all)
setInterval("doBlink()",1000)//1000 is the speed of the blink
}
|
حال باز هم از تگ blink استفاده می کنیم :
|
۱
۲
|
|
اما شما هم می توانید با استفاده از ترکیب کدهای بالا در تمام مرورگرها از متن چشمک زن استفاده نمایید.
مثلا در یک فایل از کدهای Css , JavaScript استفاده نمایید .
|
۱
۲
۳
۴
۵
۶
۷
۸
۹
۱۰
۱۱
۱۲
۱۳
۱۴
۱۵
۱۶
۱۷
۱۸
۱۹
۲۰
۲۱
۲۲
۲۳
۲۴
۲۵
۲۶
۲۷
|
function doBlink() {
var blink = document.all.tags("blink")
for (var i=0; i
blink[i].style.visibility = blink[i].style.visibility == "" ? "hidden" : ""
}
function startBlink() {
if (document.all)
setInterval("doBlink()",1000)//1000 is the speed of the blink
}
>
@-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;
}
|
حال با کد بالا در هر سه مرورگر قابل پشتیبانی خواهد بود.
