Поворот Букв На Случайный Градус

Тема в разделе "HTML, CSS, XML, JavaScript", создана пользователем DarkTimur, 6 янв 2013.

  1. DarkTimur

    DarkTimur New Member

    Регистрация:
    6 янв 2013
    Сообщения:
    1
    Симпатии:
    0
    Здравствуйте. Мне потребовалось создать эффект неровно написанных букв. Немного подумав я понял, что мне нужно поворачивать каждую букву на случайный градус. Поискав в Интернете подобный скрипт, я нашел нечто подобное, написанное в связке HTML + Javascript. Скрипт я отредактировал "под себя", вот что у меня получилось:


    Код (Text):
    <?xml version="1.0" encoding="utf-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=Windows-1251" />


    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>

    <script type="text/javascript">
    <!--
    jQuery(document).ready(function(){
    if ((jQuery.browser.msie == true)&(jQuery.browser.version <=8))
    {
    var deg2radians = Math.PI * 2 / 360,
    deg = Math.floor((Math.random()*2)-2);
    rad = deg * deg2radians,
    costheta = Math.cos(rad),
    sintheta = Math.sin(rad);

    jQuery('.rotatedBlock').css({
    filter: 'progid:DXImageTransform.Microsoft.Matrix(M11='+costheta+', M12='+(-1)*sintheta+', M21='+sintheta+', M22='+costheta+', SizingMethod="auto expand", enabled=true)'
    });
    };
    });
    -->
    </script>


    <style type="text/css">
    <!--
    .main{
    padding-top: 130px;
    }
    .rotatedBlock {
    text-align: left;
    font-size: 14px;
    line-height: 34px;
    color: #000;
    width: 250px;
    }
    -->
    </style>

    </head>
    <body>


    <div class="main">
    <div class="rotatedBlock">
    Любой текст 1
    </div>
    <div class="rotatedBlock">
    Любой текст 2
    </div>
    <div class="rotatedBlock">
    Любой текст 3
    </div>
    </div>

    </body>
    </html>
    Скрипт поворачивает заданный текст на n-ный градус, где n - случайное число между -2 и 2.
    Однако мне надо, чтоб скрипт поворачивал каждую букву на случайный градус, при этом, чтоб разница между градусами букв была не слишком большая, например:

    Слово: Текст
    буква Т повернута на 0.5°
    буква е повернута на 0.3°
    буква с повернута на 0.1°
    буква к повернута на -0.2°
    буква т повернута на 0°

    Заранее большое спасибо за помощь.


    Добавлено: -
     
Загрузка...

Поделиться этой страницей