Форум Сайтостроение Доменные имена

Переключатель регистра на JQuery для доменных портфолио

Yasuka
На сайте с 11.11.2009
Offline
151
Yasuka
1116

Еще один способ поменять регистр доменного имени на сайте.

Подсмотрел на Bido.com и переделал, согласно своим предпочтениям.

Создаем переключающую кнопку: 


<a href="#" class="button" id="changeRegister">строчными</a>

Доменные имена вкладываем в какой-нибудь контейнер: 


<span class="domain">Example.com</span>

Затем при помощи JQuery преобразуем символы доменного имени в заглавные: 


$('.domain').css('text-transform', 'uppercase');

И пишем код, который будет определять актуальное состояние, а затем переключать регистр и менять текст в кнопке: 


    function changeFontSize() {

          if ($('.domain').css('text-transform') == 'uppercase') {  

               $('.domain').css('text-transform', 'lowercase ');

               $('#changeRegister').html('ПРОПИСНЫМИ');

        } else {

               $('.domain').css('text-transform', 'uppercase');

               $('#changeRegister').html('строчными');

        }

Добавляем в JQuery код, который все это будет запускать при нажатии на кнопку: 


          $('.button').click(function(){

               changeFontSize()

               return false;

        });

Все вместе будет выглядеть приблизительно так: 


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

  <head>

    <meta http-equiv="content-type" content="text/html; charset=utf-8" />

    <title>

      Второй переключатель регистра

    </title>

    <style type="text/css">

    *{margin:0;padding:0;}

    body{font:bold 12px/20px Arial,sans-serif;width:100%;}

    </style>

    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js">

</script>

    <script language="javascript" type="text/javascript">



    $(document).ready(function() {



          $('.domain').css('text-transform', 'uppercase');



          $('.button').click(function(){

               changeFontSize()

               return false;

        });   



    });



    function changeFontSize() {

          if ($('.domain').css('text-transform') == 'uppercase') {  

               $('.domain').css('text-transform', 'lowercase ');

               $('#changeRegister').html('ПРОПИСНЫМИ');

        } else {

               $('.domain').css('text-transform', 'uppercase');

               $('#changeRegister').html('строчными');

        }

    }



    </script>

  </head>

  <body>

    <div id="container">

      <a href="#" class="button" id="changeRegister" name="changeRegister">строчными</a><br />

      <span class="domain">Example.com</span>

    </div>

  </body>

</html>

Пример.

Еще один способ переключения на доменном форуме.

Ваши идеи и замечания принимаются.

Спасибо за внимание.

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий