Qixi Festival approche, j'ai écrit un artefact de confession avec du code!

Le festival Qixi arrive bientôt et il est temps pour les célibataires de se venger de la société. Êtes-vous prêt pour le festival Qixi de cette année, célibataires? Avez-vous réservé toutes les places à numéro unique du cinéma? Frapper à l'hôtel la nuit? Aiguille TT? Ces trucs à l'ancienne ne sont plus d'actualité! Alors, comment jouer des tours au Festival Qixi de cette année? Comme le dit le dicton, une dent pour une dent, la meilleure façon de lutter contre quelqu'un qui montre de l'affection est de se montrer. En tant que programmeurs de flux techniques, bien sûr, nous devons installer A + 1 à notre manière. Peut-être que votre déesse sera fascinée par votre poésie et votre talent ~

D'abord sur les rendus

D'une manière générale, il présente les caractéristiques suivantes:

1. Belle interface de chargement;
2. Pluie de fleurs plein écran + BGM;
3. Je vous aime depuis le temps (depuis combien de temps êtes-vous amoureux des autres);
4. Galerie rotative 3D;
5. Effet machine à écrire
6. Bien sûr, le fond et le contour sont également très agréables ~

Placement spécifique

La configuration de la Goddess Photo Gallery: page d'accueil index.html ligne 80 démarre:

<div id="perspective">
  <div id='wrap'>
    <img src="./images/lq1.jpg" />
    <img src="./images/lq2.jpg" />
    <img src="./images/lq3.jpg" />
    <img src="./images/lq4.jpg" />
    <img src="./images/lq5.jpg" />
    <img src="./images/lq6.jpg" />
    <img src="./images/lq7.jpg" />
    <img src="./images/lq8.jpg" />
    <img src="./images/lq9.jpg" />
    <img src="./images/lq10.jpg" />
  </div>
</div>

Charger la configuration du plug-in d'animation: index.html ligne 133:

$(".fakeloader").fakeLoader({
    
    
    timeToHide:4000, //动画加载时间，单位毫秒
    bgColor:"#34495e", //背景颜色
    spinner:"spinner3" //加载动画类型
});

Configuration du contenu de la machine à écrire: commencez à partir de la ligne 8 du fichier de configuration romantique.js:

$("#curs").click(function(){
    
    
   var str = '「陆晴」，我喜欢你\n';
   str += '我知道我不会甜言蜜语\n';
   str += '但是我会用行动证明一切\n';
   str += '我相信，陪伴是最好的誓言\n';
   str += '往后余生里，风雪是你\n';
   str += '春华是你，秋黄是你\n';
   str += '四季冷暖是你\n';
   str += '目光所至\n';
   str += '都是\n';
   str += '你';
   Printer.init(str, {
    
    
        //speed: 90,  //文字速度
        selector: 'canvas',
        //lnStr: 'root@demo ~/ # ',
        //"curSpeed" : 50,
        "speed" : 400,  //文字速度
        // "selector" : 'canvas', //选择器
        // "startIndex" : 0,   //从第几个字符开始打印
        // "endIndex" : 0,    //打印到第几个字符结束
        "hasCur" : true,   //是否显示光标
         // "curId" : 'cur',   //光标的ID
         // "curStr" : '_', //光标字符
         // "curStyle" : 'font-weight: bold;',  //光标的样式（CSS样式）
         "curSpeed" : 800, //光标速度（ms）
         // "lnStr": "" //行首字符
   }).print();
        $("#curs").attr("disabled","disabled");
        $(".contact").css('display','none');
 });

Configurez l'heure de début du laps de temps, puis calculez automatiquement combien de temps vous avez le béguin pour ~: la ligne 51 du fichier de configuration romantique.js démarre:

//timer
    function SetTime(){
    
    
        var oDay = document.getElementById("t_d");
        var oHours = document.getElementById("t_h");
        var oMinutes = document.getElementById("t_m");
        var oSeconds = document.getElementById("t_s");
        var date1=new Date("Tus Dec 25 2018 00:00:00 GMT+0800"); //开始时间
        var date2=new Date(); //结束时间
        console.log(date2);
        var date3=date2.getTime()-date1.getTime() ;//时间差的毫秒数
		//计算出相差天数
        var days=Math.floor(date3/(24*3600*1000));
		//计算出小时数
        var leave1=date3%(24*3600*1000); //计算天数后剩余的毫秒数
        var hours=Math.floor(leave1/(3600*1000));
		//计算相差分钟数
        var leave2=leave1%(3600*1000); //计算小时数后剩余的毫秒数
        var minutes=Math.floor(leave2/(60*1000));
		//计算相差秒数
        var leave3=leave2%(60*1000); //计算分钟数后剩余的毫秒数
        var seconds=Math.round(leave3/1000);
        //alert(" 相差 "+days+"天 "+hours+"小时 "+minutes+" 分钟"+seconds+" 秒");
        var LoveDay = new Date();
        var ms=0;
        var sec=seconds;
        var min=minutes;
        var hour=hours;
        var day = days;
        timer=setInterval(function(){
    
    
            oDay.innerHTML = day;
            oHours.innerHTML = hour;
            oMinutes.innerHTML = min;
            oSeconds.innerHTML = sec;
            //oDiv.innerHTML=time;
            ms=ms+50;
            if(ms>999){
    
    
                ms=0;
                sec++;
            }
            if(sec>59){
    
    
                sec=0;
                min++;
            }
            if(min>59){
    
    
                min=0;
                hour++;
            }
            if(hour>23){
    
    
                hour=0;
                day++;
            }

        },50)
    };

Code source Web

Nuage de code : https://gitee.com/geekadpt/express

le public

Pile technologique LAMPer