• Home > Web Front-end > JS Tutorial > body text

    Using random numbers to create special effects on JavaScript web pages_Typical special effects

    WBOY
    Release: 2016-05-16 19:13:11
    Original
    1185 people have browsed it

    The online world is extremely exciting, and if special effects are used appropriately, the gorgeous pages will be even more beautiful. Here are the special effects I summarized:
    Jumping text
    Want to see dancing text? bring it on!
    Code: First add 〈script language="JavaScript"〉 between 〈head〉 and 〈/head〉
     〈!--
     function font11()
     //Define function font11()
     {
     document.all.a1.style.fontSize=16
     Math.floor(Math.random()*24); //Call the Math.random() function to generate a random number and then use it The Math.floor() function generates the next number less than or equal to Math.random()*24 to change the text size
      c1=Math.floor(Math.random()*256);
    c2=Math .floor(Math.random()*256);
    c3=Math.floor(Math.random()*256);
    document.all.a1.style.color="rgb(" c1 ", " c2 "," c3 ")"; //Same as above, change the text color (using RGB color adjustment)
    timer=setTimeout('font11()',200); //Call the font11() function every 200 milliseconds
     }
     ---〉〈/script〉
     Add onLoad="font11();" in

    and finally add where needed Fly〈/span〉
    Features: Text color and size can be changed randomly.
    Extension: Multiple sets of codes can be added to the web page, in which font11 represents different text. In the future, it will be font12, font13, etc. The text can be represented as different.
    The picture fades in and out
    As time goes by, the picture also changes from blur to clear in a cycle.
    Code: First add 〈script language="JavaScript"〉 between 〈head〉 and 〈/head〉
    〈!--
    mark=0;
    function tupian() //Create Function tupian()
     {
     if(photo.filters.alpha.opacity〈10)
     //When the image transparency is less than 10
     mark=1;
     if(photo.filters. alpha.opacity〉98)
    //When the image transparency is greater than 98
    mark=-1;
    step=2*mark;
    photo.filters.alpha.opacity =step;
    //Transparent value counter accumulates
    setTimeout('tupian()',20);
    //The program is executed every 20 milliseconds
    }
    ---〉〈/script〉
    Then add id="photo" and style="filter:alpha(opacity=0;)" to the image attributes
    Finally, add 〈script〉〈!--
    tupian() after the image code ;
     ---〉〈/script〉
    Features: Pictures cycle and fade in and out.
    The codes in this article are very simple, and I have explained everything that needs explanation.
    source:php.cn
    Statement of this Website
    The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
    Popular Tutorials
    More>
    Latest Downloads
    More>
    Web Effects
    Website Source Code
    Website Materials
    Front End Template