Как создать и настроить свой веб-сервер на VDS (05 сен 2024)

Осенью самое время заняться установкой и тюнингом своего веб-сервера. Не правда ли?

Lazy Line Painter. Чудеса и трюки jQuery

Aleksej
Автор темы
Не в сети
Модератор

Больше

10 года 1 мес. назад #1 от Aleksej

Aleksej создал тему: Lazy Line Painter. Чудеса и трюки jQuery

Подробности - в блоге, загляните по ссылке , здесь лишь публикую код, работающий на страничке. Возможно, кому-то пригодится; особенно если этот "кто-то" умеет рисовать чуть лучше, чем я.

Code:

<script src="jquery-1.9.1.min.js"></script>
<script>window.jQuery || document.write('<script src="jquery-1.9.1.min.js"><\/script>')</script>
<script src="raphael-min.js"></script> 

<script src="jquery.lazylinepainter-1.4.1.min.js"></script> 

<script type="text/javascript"> 
(function( $ ){ 
var svgData = { 
"demo" :
{ 
"strokepath" :
[ 
{ "path": "M 314.5,179. L 313.5,179.5 310.5,178.5 307.5,177.5 304.5,177.5 299.5,177.5 297.5,177.5 295.5,177.5 294.5,177.5 293.5,177.5 292.5,177.5 290.5,177.5 287.5,179.5 286.5,181.5 285.5,181.5 285.5,182.5 284.5,182.5 284.5,184.5 284.5,185.5 283.5,186.5 283.5,187.5 283.5,188.5 283.5,189.5 283.5,191.5 283.5,192.5 283.5,193.5 283.5,195.5 283.5,196.5 283.5,197.5 283.5,198.5 285.5,200.5 286.5,201.5 287.5,203.5 289.5,205.5 290.5,206.5 291.5,206.5 293.5,207.5 295.5,207.5 299.5,208.5 300.5,208.5 301.5,208.5 302.5,208.5 303.5,208.5 304.5,208.5 305.5,208.5 306.5,208.5 307.5,207.5 307.5,205.5 308.5,205.5 309.5,204.5 309.5,203.5 309.5,202.5 310.5,202.5 311.5,202.5 312.5,201.5 312.5,200.5 312.5,199.5 312.5,198.5 313.5,198.5 313.5,197.5 313.5,196.5 314.5,195.5 314.5,194.5 314.5,193.5 314.5,192.5 315.5,190.5 315.5,189.5 316.5,189.5 316.5,188.5 316.5,187.5 316.5,186.5 316.5,185.5 316.5,184.5 316.5,183.5 316.5,182.5 315.5,182.5 314.5,182.5 313.5,182.5 ",
"duration": 1800
},
{
"path": "M 301.5 208.5 L 300.5 271.5",
"duration": 600
},
{
"path": "M 302.5 211.5 L 242.5 197.5",
"duration": 600
},
{
"path": "M 306.5 211.5 L 343.5 254.5",
"duration": 600
},
{
"path": "M 300.5 267.5 L 257.5 335.5",
"duration": 600
},
{
"path": "M 257.5 335.5 L 230.5 335.5",
"duration": 600
},
{
"path": "M 300.5 269.5 L 330.5 324.5",
"duration": 600
},
{
"path": "M 330.5 324.5 L 314.5 333.5",
"duration": 600
},
{
"path": "M 251.5 145.5 L 238.5 212.5",
"duration": 600
},
{
"path": "M 184.5 139.5 L 343.5 142.5",
"duration": 600
},
{
"path": "M 270.5 96.5 L 188.5 139.5",
"duration": 600
},
{
"path": "M 270.5 98.5 L 345.5 140.5",
"duration": 600
},
{
"path": "M 483.5 2.5 L 483.5 15.5",
"duration": 600
},
{
"path": "M 482.5 15.5 L 485.5 30.5",
"duration": 600
},
{
"path": "M 485.5 30.5 L 494.5 52.5",
"duration": 600
},
{
"path": "M 494.5 52.5 L 508.5 70.5",
"duration": 600
},
{
"path": "M 507.5 70.5 L 522.5 92.5",
"duration": 600
},
{
"path": "M 522.5 92.5 L 546.5 111.5",
"duration": 600
},
{
"path": "M 546.5 111.5 L 572.5 122.5",
"duration": 600
},
{
"path": "M 572.5 122.5 L 600.5 133.5",
"duration": 600
},
{
"path": "M 599.5 132.5 L 619.5 141.5",
"duration": 600
},
{
"path": "M 618.5 141.5 L 627.5 143.5",
"duration": 600
},
{
"path": "M 626.5 143.5 L 637.5 143.5",
"duration": 600
},
{
"path": "M 470.5 4.5 L 85.5 33.5",
"duration": 600
},
{
"path": "M 467.5 30.5 L 352.5 73.5",
"duration": 600
},
{
"path": "M 484.5 68.5 L 373.5 124.5",
"duration": 600
},
{
"path": "M 496.5 100.5 L 370.5 208.5",
"duration": 600
},
{
"path": "M 529.5 144.5 L 420.5 339.5",
"duration": 600
},
{
"path": "M 586.5 176.5 L 557.5 452.5",
"duration": 600
},
{
"path": "M 28.5 361.5 L 10.5 429.5",
"duration": 600
},
{
"path": "M 31.5 364.5 L 35.5 397.5",
"duration": 600
},
{
"path": "M 36.5 397.5 L 56.5 361.5",
"duration": 600
},
{
"path": "M 56.5 361.5 L 40.5 423.5",
"duration": 600
},
{
"path": "M 61.5 397.5 L 54.5 422.5",
"duration": 600
},
{
"path": "M 60.5 398.5 L 84.5 399.5",
"duration": 600
},
{
"path": "M 84.5 399.5 L 77.5 419.5",
"duration": 600
},
{
"path": "M 62.5 407.5 L 79.5 407.5",
"duration": 600
},
{
"path": "M 111.5 394.5 L 97.5 394.5",
"duration": 600
},
{
"path": "M 97.5 394.5 L 93.5 407.5",
"duration": 600
},
{
"path": "M 93.5 407.5 L 111.5 407.5",
"duration": 600
},
{
"path": "M 111.5 407.5 L 108.5 420.5",
"duration": 600
},
{
"path": "M 107.5 419.5 L 88.5 419.5",
"duration": 600
},
{
"path": "M 134.5 393.5 L 127.5 418.5",
"duration": 600
},
{
"path": "M 121.5 391.5 L 155.5 390.5",
"duration": 600
},
{
"path": "M 166.5 389.5 L 156.5 417.5",
"duration": 600
},
{
"path": "M 156.5 417.5 L 176.5 417.5",
"duration": 600
},
{
"path": "M 164.5 404.5 L 172.5 403.5",
"duration": 600
},
{
"path": "M 168.5 391.5 L 184.5 392.5",
"duration": 600
},
{
"path": "M 195.5 387.5 L 188.5 417.5",
"duration": 600
},
{
"path": "M 197.5 386.5 L 214.5 387.5",
"duration": 600
},
{
"path": "M 214.5 387.5 L 214.5 398.5",
"duration": 600
},
{
"path": "M 214.5 398.5 L 193.5 404.5",
"duration": 600
},
{
"path": "M 193.5 404.5 L 209.5 412.5",
"duration": 600
},
{
"path": "M 230.5 383.5 L 225.5 413.5",
"duration": 600
},
{
"path": "M 234.5 387.5 L 250.5 386.5",
"duration": 600
},
{
"path": "M 250.5 385.5 L 246.5 400.5",
"duration": 600
},
{
"path": "M 246.5 400.5 L 227.5 404.5",
"duration": 600
},
{
"path": "M 265.5 384.5 L 259.5 417.5",
"duration": 600
},
{
"path": "M 265.5 386.5 L 286.5 385.5",
"duration": 600
},
{
"path": "M 286.5 385.5 L 283.5 399.5",
"duration": 600
},
{
"path": "M 284.5 397.5 L 265.5 400.5",
"duration": 600
},
{
"path": "M 265.5 400.5 L 282.5 414.5",
"duration": 600
},
{
"path": "M 300.5 382.5 L 296.5 414.5",
"duration": 600
},
{
"path": "M 296.5 413.5 L 314.5 413.5",
"duration": 600
},
{
"path": "M 314.5 413.5 L 317.5 379.5",
"duration": 600
},
{
"path": "M 300.5 383.5 L 319.5 382.5",
"duration": 600
},
{
"path": "M 331.5 406.5 L 332.5 411.5",
"duration": 600
},
{
"path": "M 354.5 380.5 L 360.5 410.5",
"duration": 600
},
{
"path": "M 368.5 393.5 L 368.5 394.5",
"duration": 600
},
{
"path": "M 368.5 395.5 L 363.5 404.5",
"duration": 600
},
{
"path": "M 367.5 393.5 L 375.5 406.5",
"duration": 600
},
{
"path": "M 377.5 405.5 L 389.5 378.5",
"duration": 600
},
{
"path": "M 417.5 379.5 L 401.5 379.5",
"duration": 600
},
{
"path": "M 402.5 378.5 L 395.5 390.5",
"duration": 600
},
{
"path": "M 395.5 390.5 L 406.5 390.5",
"duration": 600
},
{
"path": "M 406.5 390.5 L 410.5 390.5",
"duration": 600
},
{
"path": "M 410.5 390.5 L 406.5 406.5",
"duration": 600
},
{
"path": "M 406.5 406.5 L 387.5 407.5",
"duration": 600
},
{
"path": "M 5.5 445.5 L 524.5 416.5",
"duration": 600
},
{
"path": "M 264.5 107.5 L 236.5 127.5",
"duration": 600
},
{
"path": "M 265.5 112.5 L 260.5 128.5",
"duration": 600
},
{
"path": "M 275.5 110.5 L 302.5 129.5",
"duration": 600
}
],
"dimensions": {
"width": 640,
"height": 480 }
}
}

$(document).ready(function(){

$('#demo').lazylinepainter({
'svgData' : svgData,
'strokeWidth':7, 
'strokeColor':'#dc908e',
'onComplete' : function(){
} 
}
) 

$('#demo').lazylinepainter('paint');
})
})( jQuery );

</script>

<div id='demo'></div>

Пожалуйста Войти или Регистрация, чтобы присоединиться к беседе.

Jannet
Не в сети
Давно я тут

Больше

6 года 3 мес. назад - 6 года 3 мес. назад #2 от Jannet

Jannet ответил в теме Lazy Line Painter. Чудеса и трюки jQuery

Внутри - обаятельная усатая мыша.

index.html

Code:

<script src="jquery-3.3.1.min.js"></script> 
<script src="jquery.lazylinepainter-1.7.0.min.js"></script> 
<script type="text/javascript" src="svgdata.js"></script>
<script type="text/javascript">
   (function( $ ){
   	$(document).ready(function(){
   		var $lazy = $('#lazy');
              $lazy.lazylinepainter({
                  'svgData': svgData,
                  'strokeWidth': 3,
                  'strokeColor': '#777',
              });
                    setTimeout(function(){
                        $lazy.lazylinepainter('paint');
                    }, 10)
   	})
   })( jQuery );
</script>
<div class="content_lazy">
   <div id='lazy'></div>
</div>

svgdata.js

Code:

/* 
 * Lazy Line Painter - Path Object 
 * Generated using 'SVG to Lazy Line Converter'
 * 
 * http://lazylinepainter.info 
 * Copyright 2013, Cam O'Connell  
 *  
 */ 
 
var svgData = {
    "lazy": {
        "strokepath": [
            {
                "path": "m33.968 191.28c-11.099 5.81-32.517-3.11-32.517-3.11",
                "duration": 600
            },
            {
                "path": "m39.36 184.2c-28.887-7.02-35.995-36.49-35.995-36.49",
                "duration": 600
            },
            {
                "path": "m45.488 200.51c-23.835-2-31.847 18.19-31.847 18.19",
                "duration": 600
            },
            {
                "path": "m405.84 273.83c-23.81 9.84-56.82 17.75-77.63 5.76 0 0-25.23 55.09-39.87 68.62-15.62 14.42-31.05 24.73-31.05 24.73l-55.07-1.74s1.89 10.84-16.72 16.05c-15.13-13.15-11.71-27.91 4.48-48.23 11.59-14.53 71.36-8.6 71.36-8.6l15.33-32.09c-10.36-10.61-17.64-10.38-33.98-22.01l-11.27 36.19s-50.46 16.17-71.72 37.43-42.52 0-42.52 0l42.52-42.51 42.52-21.26 13.2-38.18s-20.77-27.33-55.96-39.04c-35.19-11.72-84.794-7.82-84.794-7.82s-31.889 5.31-42.519 0c-10.629-5.32 4.054-24.67 4.054-24.67s40.616-20.66 61.875-41.92c21.264-21.26 61.624-60.965 61.624-60.965s-26.67-23.865-5.41-45.124 30.9-17.219 43.06-6.196c16.75 15.201-6.38 41.034-0.18 45.613 8.6-6.837 8.56 14.099 19.17-22.212 10.65-36.406 48.72-56.286 70.92-35.858 21.24 19.542-5.7 60.303-5.7 60.303s89.31-45.227 154.51-39.044 79.72 21.259 106.3 63.777c26.57 42.516-2.65 114.61-2.65 114.61s49.72 26.8 39.75 72.67-50.98 81.72-82.99 97.08c-32.01 15.35-128.92 46.5-150.98 50.58-22.82 4.22-89.91 26.43-116.49 58.32-26.57 31.89 2.83 58.55 21.02 73.82 18.19 15.28 14.8 24.37 14.8 24.37s-42.47-0.34-58.44-14.81c-22.27-20.2-38.51-59.81-18.33-96.58s69.1-68.63 122.02-73.45c53.67-4.89 185.92-63.96 211.46-88.35 25.55-24.39-10.74-64.48-10.74-64.48l-36.39 9.72s7.2 38.92 3.13 43.88c-4.06 4.96-34.57 33.59-34.57 33.59l-70.68 14.14-29.2 7.24s3.43-25.61 24.43-40.03c21-14.43 60.18-7.78 60.18-7.78l-20.61-36.36c-31.89-50.83-34.01-94.48 26.82-124.57",
                "duration": 2500
            },
            {
                "path": "m186.12 112.12c-7.5 0-13.59 5.67-13.59 12.63s6.09 12.59 13.59 12.59c7.51 0 13.6-5.63 13.6-12.59s-6.09-12.63-13.6-12.63zm-4.37 4.07c0.43 0.05 0.82 0.23 1.13 0.53 1.21 1.21 0.74 4.05-1.07 6.37-1.8 2.33-4.28 3.24-5.5 2.03-1.22-1.2-0.74-4.08 1.07-6.4 1.35-1.74 3.08-2.68 4.37-2.53z",
                "duration": 600
            },
            {
                "path": "m150.93 208.18c38.15-6.88 43.91-31.93 43.91-31.93",
                "duration": 600
            },
            {
                "path": "m39.291 192.23c31.897-47.85 31.897-63.8 31.897-63.8",
                "duration": 600
            },
            {
                "path": "m48.21 196.27c17.551-9.38 37.649-11.6 56.65-6.42",
                "duration": 600
            },
            {
                "path": "m51.179 187.68c13.848-5.81 34.778-23.66 51.261-28.54",
                "duration": 600
            },
            {
                "path": "m35.346 177.85c-14.882 11.48-4.35 27.97 11.616 24.59l-11.616-24.59z",
                "duration": 600
            },
            {
                "path": "m267.57 69.122s-46.81-6.202-46.81-6.202 2.44-14.138 11.33-27.413c8.96-13.394 14.38-21.372 26.97-23.994 12.58-2.6217 18.3 3.776 22.93 12.139 4.63 8.364 1.73 12.912-1.99 23.937-3.71 11.025-12.43 21.533-12.43 21.533z",
                "duration": 600
            }
        ],
        "dimensions": {
            "width": 900,
            "height": 900
        }
    }
}; 

Еще немного - и я всему научусь.

Последнее редактирование: 6 года 3 мес. назад пользователем Jannet.

Спасибо сказали: serge

Пожалуйста Войти или Регистрация, чтобы присоединиться к беседе.

serge
Не в сети
Модератор

Больше

6 года 3 мес. назад #3 от serge

serge ответил в теме Lazy Line Painter. Чудеса и трюки jQuery

Супер! только выпрыгивает мышка долго.

А я смогу! - А поглядим! - А я упрямый!

Пожалуйста Войти или Регистрация, чтобы присоединиться к беседе.

Aleksej
Автор темы
Не в сети
Модератор

Больше

6 года 3 мес. назад #4 от Aleksej

Aleksej ответил в теме Lazy Line Painter. Чудеса и трюки jQuery

masterpro.ws/announcements/lazylinepainter

Пожалуйста Войти или Регистрация, чтобы присоединиться к беседе.

Работает на Kunena форум