Question

HTML / CSS的新功能-尝试使闪烁的，跳动的彩虹标题变为“ Awesome Text”，但它只是空白。根据此处的示例https://codepen.io/raaasin/pen/quvHr。

任何想法出了什么问题？只要删除CSS颜色更改元素，它就可以工作。

<head>
  <title>This is awesome</title>  
  <style>
    .awesome {

      font-family: futura;
      font-style: italic;

      width:100%;

      margin: 0 auto;
      text-align: center;

      color:#313131;
      font-size:45px;
      font-weight: bold;
      position: absolute;
      -webkit-animation:colorchange 20s infinite alternate;      

    }

    @-webkit-keyframes colorchange {
      0% { color: blue; }      
      10% { color: #8e44ad; }
      20% { color: #1abc9c; }      
      30% { color: #d35400; }      
      40% { color: blue; }      
      50% { color: #34495e; }      
      60% { color: blue; }      
      70% { color: #2980b9; }
      80% { color: #f1c40f; }      
      90% { color: #2980b9; }      
      100% { color: pink; }
    }
  </style>

</head>

<body onload="blink();">

<html>
<body style="background-color:black;">
<font color="green">

<marquee direction="down" width="1000" height="100" behavior="alternate">
  <marquee behavior="alternate">
    <h1><div id="blinking"><p class="awesome">Awesome Text</p></div></h1>
  </marquee>
</marquee>   


</font>
</html>

<script>


function blink() {
    var f = document.getElementById('blinking');
    setInterval(function() {
        f.style.display = (f.style.display == 'none' ? '' : 'none');
    }, 300);
}

</script>

Answer 1

如果您删除position: absolute;，它将开始弹跳

  -webkit-animation:colorchange 2s infinite alternate;

这是20秒，也就是20秒，所以我将其缩短为2。更改为您喜欢的：）

Answer 2

您是：

缺少身体标记
已设置位置，因此您看不到
间隔20秒，使其更快，您会发现它发生变化

// PUB_sender( "<tcp4>://<A.B.C.D>:<PORT>" ); // will launch it
//              <tcp6>://[::1]:<PORT>
//          <tls+tcp4>://<___aTransportClass_specific_AccessPoint_ADDRESS_>:<_aTransportClass_spcific_AccessPoint_SPECIFIER>
//
// -------------------------------------------------------------------
// SUB_client( "..." ); // anyone ( all ) who will "dial-in" will receive messages

#define PUT64( ptr, u )                              \
    do {                                             \
        (ptr)[0] = (uint8_t)(((uint64_t)(u)) >> 56); \
        (ptr)[1] = (uint8_t)(((uint64_t)(u)) >> 48); \
        (ptr)[2] = (uint8_t)(((uint64_t)(u)) >> 40); \
        (ptr)[3] = (uint8_t)(((uint64_t)(u)) >> 32); \
        (ptr)[4] = (uint8_t)(((uint64_t)(u)) >> 24); \
        (ptr)[5] = (uint8_t)(((uint64_t)(u)) >> 16); \
        (ptr)[6] = (uint8_t)(((uint64_t)(u)) >> 8);  \
        (ptr)[7] = (uint8_t)((uint64_t)(u));         \
    } while (0)
int
PUB_sender( const char *aTransportClassAccessPointURL )
{
   int        aRetVAL = -1;
   nng_socket aSOCKET = NNG_SOCKET_INITIALIZER;
// ---------------------------------aSOCKET = Context().socket( PUB );
   if ( ( aRetVAL = nng_pub0_open( &aSOCKET )
          ) != 0 )                  fatal( "nng_pub0_open",
                                            aRetVAL 
                                            );

// ---------------------------------aSOCKET.bind( aTransportClassAccessPointURL );
   if ( ( aRetVAL = nng_listen(     aSOCKET,
                                    aTransportClassAccessPointURL,
                                    NULL,
                                    NNG_FLAG_NONBLOCK
                                    )
          ) != 0 )                  fatal( "nng_listen",
                                            aRetVAL
                                            );

// ---------------------------------aSOCKET.setsockopt( LINGER, 0 );
   if ( ( aRetVAL = nng_setopt_int( aSOCKET,
                                    NNG_OPT_LINGER,
                                    0
                                    )
          ) != 0 )                  fatal( "nng_setopt_int",
                                            aRetVAL
                                            );
   for (;;)
   {
       char *   aBUF = "12345678";
       uint64_t aVAL;
       time_t   aNOW;

       aNOW = time( &aNOW ); printf( "PUB.send()-s: "); showdate( aNOW );

       PUT64( aBUF, (uint64_t) aNOW );

   // ----------------------------aSOCKET.send( aBUF, ... );
      if ( ( aRetVAL = nng_send(  aSOCKET,
                                  aBUF,
                                  sizeof( aBUF ),
                                  NNG_FLAG_ALLOC
                                  )
             ) != 0 )             fatal( "nng_send",
                                          aRetVAL
                                          );
   }
   nng_free(  aBUF, 8 );
   nng_close( aSOCKET );
}

粘性文字未出现

2 个答案: