Code html tạo chữ chạy 7 màu wordpress siêu đẹp

Helllo ….Xin chào các anh em đã quay trở lại với website Cam Ranh Media của mình. Hôm trước, mình đã chia sẽ cách tạo code html tạo chữ chạy 7 màu siêu đẹp trên WordPress.

Bạn cần biết:Dịch vụ thuê xe du lịch tự lái tại Cam Ranh

Méo nói nhiều vô thẳng vấn đề luôn và ngay bên dưới.

Code html tạo chữ chạy 7 màu wordpress siêu đẹp

Ở đây mình xin chia sẽ 2 cách chạy chữ 7 màu với javascript.

Cách 1: Mã sẽ đơn giản hơn rất là nhiều

<div style="font-size: 20px">
<script type="text/javascript">
farbbibliothek = new Array();
farbbibliothek[0] = new Array("#FF0000","#FF1100","#FF2200","#FF3300","#FF4400","#FF5500","#FF6600","#FF7700","#FF8800","#FF9900","#FFaa00","#FFbb00","#FFcc00","#FFdd00","#FFee00","#FFff00","#FFee00","#FFdd00","#FFcc00","#FFbb00","#FFaa00","#FF9900","#FF8800","#FF7700","#FF6600","#FF5500","#FF4400","#FF3300","#FF2200","#FF1100");
farbbibliothek[1] = new Array("#00FF00","#000000","#00FF00","#00FF00");
farbbibliothek[2] = new Array("#00FF00","#FF0000","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00","#00FF00");
farbbibliothek[3] = new Array("#FF0000","#FF4000","#FF8000","#FFC000","#FFFF00","#C0FF00","#80FF00","#40FF00","#00FF00","#00FF40","#00FF80","#00FFC0","#00FFFF","#00C0FF","#0080FF","#0040FF","#0000FF","#4000FF","#8000FF","#C000FF","#FF00FF","#FF00C0","#FF0080","#FF0040");
farbbibliothek[4] = new Array("#FF0000","#EE0000","#DD0000","#CC0000","#BB0000","#AA0000","#990000","#880000","#770000","#660000","#550000","#440000","#330000","#220000","#110000","#000000","#110000","#220000","#330000","#440000","#550000","#660000","#770000","#880000","#990000","#AA0000","#BB0000","#CC0000","#DD0000","#EE0000");
farbbibliothek[5] = new Array("#000000","#000000","#000000","#FFFFFF","#FFFFFF","#FFFFFF");
farbbibliothek[6] = new Array("#0000FF","#FFFF00");
farben = farbbibliothek[4];
function farbschrift(){for(var b=0;b<Buchstabe.length;b++){document.all["a"+b].style.color=farben[b]}farbverlauf()}function string2array(b){Buchstabe=new Array();while(farben.length<b.length){farben=farben.concat(farben)}k=0;while(k<=b.length){Buchstabe[k]=b.charAt(k);k++}}function divserzeugen(){for(var b=0;b<Buchstabe.length;b++){document.write("<span id='a"+b+"' class='a"+b+"'>"+Buchstabe[b]+"</span>")}farbschrift()}var a=1;function farbverlauf(){for(var b=0;b<farben.length;b++){farben[b-1]=farben[b]}farben[farben.length-1]=farben[-1];setTimeout("farbschrift()",30)}var farbsatz=1;function farbtauscher(){farben=farbbibliothek[farbsatz];while(farben.length<text.length){farben=farben.concat(farben)}farbsatz=Math.floor(Math.random()*(farbbibliothek.length-0.0001))}setInterval("farbtauscher()",5000);

text= "Chào Mừng Bạn Đến Với website Cam Ranh Media"; //h
string2array(text);
divserzeugen();
//document.write(text);
</script></div>

Cách 2: Mã hơn nhiều hơn tí nhé

<script type="text/javascript">
    <!-- Begin
    function toSpans(span) {
      var str=span.firstChild.data;
      var a=str.length;
      span.removeChild(span.firstChild);
      for(var i=0; i<a; i++) {
        var theSpan=document.createElement("SPAN");
        theSpan.appendChild(document.createTextNode(str.charAt(i)));
        span.appendChild(theSpan);
      }
    }

    function RainbowSpan(span, hue, deg, brt, spd, hspd) {
        this.deg=(deg==null?360:Math.abs(deg));
        this.hue=(hue==null?0:Math.abs(hue)%360);
        this.hspd=(hspd==null?3:Math.abs(hspd)%360);
        this.length=span.firstChild.data.length;
        this.span=span;
        this.speed=(spd==null?50:Math.abs(spd));
        this.hInc=this.deg/this.length;
        this.brt=(brt==null?255:Math.abs(brt)%256);
        this.timer=null;
        toSpans(span);
        this.moveRainbow();
    }
    RainbowSpan.prototype.moveRainbow = function() {
      if(this.hue>359) this.hue-=360;
      var color;
      var b=this.brt;
      var a=this.length;
      var h=this.hue;

      for(var i=0; i<a; i++) {

        if(h>359) h-=360;

        if(h<60) { color=Math.floor(((h)/60)*b); red=b;grn=color;blu=0; }
        else if(h<120) { color=Math.floor(((h-60)/60)*b); red=b-color;grn=b;blu=0; }
        else if(h<180) { color=Math.floor(((h-120)/60)*b); red=0;grn=b;blu=color; }
        else if(h<240) { color=Math.floor(((h-180)/60)*b); red=0;grn=b-color;blu=b; }
        else if(h<300) { color=Math.floor(((h-240)/60)*b); red=color;grn=0;blu=b; }
        else { color=Math.floor(((h-300)/60)*b); red=b;grn=0;blu=b-color; }

        h+=this.hInc;

        this.span.childNodes[i].style.color="rgb("+red+", "+grn+", "+blu+")";
      }
      this.hue+=this.hspd;
    }
    </script>
    <h2 id="r1">Cam Ranh Media - Xin chào các bạn đọc giả</h2>
    <script type="text/javascript">
    var r1=document.getElementById("r1"); //get span to apply rainbow
    var myRainbowSpan=new RainbowSpan(r1, 0, 360, 255, 50, 18); //apply static rainbow effect
    myRainbowSpan.timer=window.setInterval("myRainbowSpan.moveRainbow()", myRainbowSpan.speed);
    </script>

Lời kết

Được sử dụng mã javascript với nhiều màu sắc đẹp và cách thực hiện đơn giản. Không làm ảnh hưởng đến những thành phần khác trên blog & website cũng như tốc độ tải trang.Cho một bình luận/chia sẻ nếu thấy hữu ích nhé.

Thủ thuật Plugin code mở rộng có thể bạn cần

Tạo popup từ Contact Form 7 WordPress đơn giản

Tạo Popup hiện ra khi click với hiệu ứng đẹp bằng CSS. Sử dụng thẻ HTML :target, popup được thiết kế chỉ hoàn toàn bằng CSS với hiệu ứng và transform tuyệt đẹp cho website. Bạn hãy tâm vì nó rất đơn gian siêu mượt như gái 18+ hehe :)).

Tạo hiệu ứng popup từ Plugin Easy FancyBox

Sau khi cài xong Easy Fancybox, bạn vào Post/Page mà bạn cần chèn form, sau đó chuyển qua chế độ soạn thảo Text (HTML), sau đó chèn một vài đoạn HTML dưới đây vào…

Tổng hợp code CSS viền trang trí website 2020

Lần nào viết nội dung cũng chẳng nhớ css viền trang trí. Gúm khổ thật, nay viết luôn một bài lưu lại để khỏi mất công tìm. Các bạn nào chưa biết thì tham khảo bài viết này luôn nhé!

Hướng dẫn bảo mật file wp-config.php mới nhất 2020

Bảo mật luôn là một vấn đề quan trọng và cấp bách hàng đầu đối với blog/ website. Trong WordPress, bạn có thể bảo mật bằng các phương pháp khác nhau, chẳng hạn như sử dụng file .htaccess, plugin…

Xem chi tiết
THÔNG TIN THÊM

Quảng cáo

Nhận Mã Giảm Giá Hosting

Tư Vấn Dịch Vụ

Chào bạn! Bạn cần tư vấn hãy gửi tin nhắn nhé!