如何用CSS动画交叉淡化多个文本?

时间:2016-08-21 13:34:04

标签: css animation css-animations fade cross-fade

我正在尝试交叉淡化多个标题,以三种语言创建欢迎信息。我重叠标题,然后首先显示englih中的欢迎信息,然后淡出并显示意大利欢迎信息,然后这一个淡出并出现西班牙语消息......并且动画重复。有点像不同语言的Apple iOS欢迎信息。我无法理解如何管理动画的时间,以便发生这种情况,并且消息不会同时发生冲突。

这是我的代码:

https://jsfiddle.net/1p7z4v0e/

Do While Browser.ReadyState <> WebBrowserReadyState.Complete
    Application.DoEvents()
Loop

1 个答案:

答案 0 :(得分:0)

由于您在三个选项之间骑行,因此您可以设置动画以显示三分之一的时间。然后,您可以将所有三个动画的持续时间设置为相同,并将第二个和第三个动画分别偏移三分之一和三分之二。以下是如何执行此操作的示例。

#!/bin/bash

##--------------START Temp Variables-------------##
KEY_USER="${KEY_USER:-$(whoami)}"

ifconfig | grep Bcast > /tmp/ip1
cat /tmp/ip1 | awk '{ print $2 }' > /tmp/ip2
rm /tmp/ip1
sed -i 's/addr://' /tmp/ip2
#ips=$(cat /tmp/ip2)
howmanyips=$(grep -c "." /tmp/ip2)
for (( i=$howmanyips; i>0; i-- ))
do  
    head -$i /tmp/ip2|tail -1 > /tmp/$i
done

ipcheck=0
intip=0
##---------------END Temp Variables--------------##

##---------------START Main Script---------------##
code...
code...
code...
code...
##---------------START Prompt Loop---------------##
while true; do
    echo -e "\e[33;44m***** CHOOSE YOUR VALID PUBLIC IP *****\e[0m"
    cat /tmp/ip2
    read -p "Please Type Your Public IP (that has internet access) from above:" uip
    readarray -t ips < <(exec ifconfig | awk '/Bcast/ { gsub(/addr:/, "", $2); print $2 }')
    for ip in "${ips[@]}"; do
        if [ $uip == $ip ]; then
            ipcheck=$ip
            intip=$i
            ping -c 1 $ip > /tmp/ipnetcheck
            ipnetcheck=$(grep -ic "0%" /tmp/ipnetcheck)
            if [ $ipnetcheck = 1 ]; then
                break
            else
                exit 130
            fi
        else
            break
        fi
    done
done