Developmen http://developmen.ru Все для разработчика Thu, 18 Dec 2014 13:52:26 +0000 ru-RU hourly 1 http://wordpress.org/?v=4.0.1 Php доступность сайта http://developmen.ru/php-dostupnost-sajta/ http://developmen.ru/php-dostupnost-sajta/#comments Thu, 18 Dec 2014 13:18:06 +0000 http://developmen.ru/?p=377 Php доступность сайта. Здравствуйте сегодня речь пойдет об очень простом кусочке скрипта который проверяет ваш любимый сайт на доступность то есть он проверяет доступен ли сайт или. Ни какого интерфейса здесь мы делать не будем а покажем толь ко лишь основы так сказать от чего вам отпираться и что дальше можно придумать сделать чтобы получился…

Запись Php доступность сайта впервые появилась Developmen.

]]>
Php доступность сайтаPhp доступность сайта. Здравствуйте сегодня речь пойдет об очень простом кусочке скрипта который проверяет ваш любимый сайт на доступность то есть он проверяет доступен ли сайт или. Ни какого интерфейса здесь мы делать не будем а покажем толь ко лишь основы так сказать от чего вам отпираться и что дальше можно придумать сделать чтобы получился нормальный мониторинг сайта

Php доступность сайта

<?php
  if (@get_headers("http://mail.ru")) echo "Сайт доступен";
  else echo "Сайт не доступен";
?>

Конечно же это самый что не наесть скрипт проверки доступности сайта но его можно улучшать добавлять новы функции например можно сделать лог файл и  в случае недоступности он будет записывать туда ошибку, а также можно отправлять на почту администратору ну вообщем суть данной статьи была рассказать от чего вам отпираться и что дальше делать  Php доступность сайта.

 

 

 

Запись Php доступность сайта впервые появилась Developmen.

]]>
http://developmen.ru/php-dostupnost-sajta/feed/ 0
Шаблон Tresto (адаптивный дизайн) http://developmen.ru/shablon-tresto-adaptivnyj-dizajn/ http://developmen.ru/shablon-tresto-adaptivnyj-dizajn/#comments Wed, 17 Dec 2014 16:03:28 +0000 http://developmen.ru/?p=371 Шаблон Tresto (адаптивный дизайн). Здравствуйте читатели нашего блога сегодня я хочу рассказать  вам о прекрасном шаблоне Tresto. Это совершенно бесплатный шаблон и он полностью адаптивный под все виды устройств, этот шаблон имеет большое количество настроек, так что вы его можете настраивать как вам нужно. Если рассматривать оформление этого шаблона то в глаза, сразу бросается   верхняя…

Запись Шаблон Tresto (адаптивный дизайн) впервые появилась Developmen.

]]>
Шаблон Tresto (адаптивный дизайн)Шаблон Tresto (адаптивный дизайн). Здравствуйте читатели нашего блога сегодня я хочу рассказать  вам о прекрасном шаблоне Tresto. Это совершенно бесплатный шаблон и он полностью адаптивный под все виды устройств, этот шаблон имеет большое количество настроек, так что вы его можете настраивать как вам нужно. Если рассматривать оформление этого шаблона то в глаза, сразу бросается

 

верхняя часть шаблона.  В левой части шаблона расположен сайтбар сайта имеются блоки поиска, свежие записи, Популярные записи

Посмотреть шаблон Tresto

Шаблон Tresto (адаптивный дизайн)

 

Скачать можно отсюда: http://skinwp.ru/download/871

 

 

 

Запись Шаблон Tresto (адаптивный дизайн) впервые появилась Developmen.

]]>
http://developmen.ru/shablon-tresto-adaptivnyj-dizajn/feed/ 0
Шаблон Yume Free (адаптивный дизайн) http://developmen.ru/shablon-yume-free-adaptivnyj-dizajn/ http://developmen.ru/shablon-yume-free-adaptivnyj-dizajn/#comments Wed, 17 Dec 2014 15:28:27 +0000 http://developmen.ru/?p=352 Шаблон Yume Free (адаптивный дизайн) шаблон премиум-класса,  очень хороший, простой шаблон подойдет к любому сайту, под любую тематику хорошо настраиваемый шаблон он имеет большое количество настроек, большое количество цветовых схем. Перейдем к содержимому шаблона записи анонсируются на главной странице для просмотра полной новости необходимо нажать кнопку читать   далее, также большой + этого  шаблона  в…

Запись Шаблон Yume Free (адаптивный дизайн) впервые появилась Developmen.

]]>
адаптивный шаблон wordpressШаблон Yume Free (адаптивный дизайн) шаблон премиум-класса,  очень хороший, простой шаблон подойдет к любому сайту, под любую тематику хорошо настраиваемый шаблон он имеет большое количество настроек, большое количество цветовых схем. Перейдем к содержимому шаблона записи анонсируются на главной странице для просмотра полной новости необходимо нажать кнопку читать

 

далее, также большой + этого  шаблона  в том что здесь каждую страницу  шаблона  в том что здесь каждую страницу сайта можно настраивать как вам нужно, еще один + здесь есть поддержка древовидных комментариев Теперь перейдем к сайтбару шаблона здесь также огромное количество + есть место для видео рекламы для обычной баннерной рекламы так же имеется модуль для рекламы, есть виджет соц сетей, рубрики блока, вообщем есть все что необходимо.

Смотрите сами как он выглядит 

адаптивный шаблон wordpress

 

Скачать Yume Free

 

 

 

 

Запись Шаблон Yume Free (адаптивный дизайн) впервые появилась Developmen.

]]>
http://developmen.ru/shablon-yume-free-adaptivnyj-dizajn/feed/ 0
Php отправка писем на email http://developmen.ru/php-otpravka-email/ http://developmen.ru/php-otpravka-email/#comments Wed, 17 Dec 2014 10:37:59 +0000 http://developmen.ru/?p=344 Php отправка писем на email Здравствуйте в этой статье речь пойдет о том как оправить письмо по email то есть функциям отправки писем. Для отправки писем на email средствами php можно взять одну из стандартных функций  mail     Mail.php [crayon-549404902ef7b403180449/] Пример [crayon-549404902ef81962105686/] Так с функцией отправки писем мы разобрались теперь у нас возникает следующая проблема…

Запись Php отправка писем на email впервые появилась Developmen.

]]>
Php отправка email Php отправка писем на email Здравствуйте в этой статье речь пойдет о том как оправить письмо по email то есть функциям отправки писем. Для отправки писем на email средствами php можно взять одну из стандартных функций  mail

 

 

Mail.php

mail("Адрес почты получателя","Тема письма","Текст письма");

Пример

mail("decelopmen@mail.ru","Регистрация","Поздравляем! Вы зарегистрированы!")

Так с функцией отправки писем мы разобрались теперь у нас возникает следующая проблема при отправке писем нам на почту приходят не понятный текст крокозябры то есть в  непонятной кодировке а так нам не нужно

Для этого пишем следующее

$message = "Переменная, в которой хранится текст сообщения";
 $email = "E-mail получателя"
 $headers  = "Content-type: text/html; charset=utf-8 \r\n";
 $headers .= "From: Ваш_домен.ру <robot@Ваш_домен.ру>\r\n";
 $subject = "Тема письма";
 mail($email, $subject, $message, $headers);

Готово теперь меняйте значения переменных на свои и все сообщения будут приходит в нормальном виде в понятной кодировке.

 

 

 

Запись Php отправка писем на email впервые появилась Developmen.

]]>
http://developmen.ru/php-otpravka-email/feed/ 0
Php безопасность входных данных http://developmen.ru/php-bezopasnost-vxodnyx-dannyx/ http://developmen.ru/php-bezopasnost-vxodnyx-dannyx/#comments Wed, 17 Dec 2014 09:31:43 +0000 http://developmen.ru/?p=339 Php безопасность входных данных. Здравствуйте читатели моего блога в этой статье речь пойдет о безопасности при написании скриптов на php которые принимает и обрабатывает числовые значения от пользователя  сейчас мы приведем простой пример и так допустим у нас есть простая html форма с небольшим списком с несколькими значениями например какой нибудь список и так приступим…

Запись Php безопасность входных данных впервые появилась Developmen.

]]>
Php безопасность при проверке входных данныхPhp безопасность входных данных. Здравствуйте читатели моего блога в этой статье речь пойдет о безопасности при написании скриптов на php которые принимает и обрабатывает числовые значения от пользователя  сейчас мы приведем простой пример и так допустим у нас есть простая html форма с небольшим списком с несколькими значениями например какой нибудь список и так приступим

 

Html Form 

<form method="POST" action="">
 
    <select name="sex">
 
        <option value=0>Не указывать</option>
 
        <option value=1>Женский</option>
 
        <option value=2>Мужской</option>
 
    </select>
 
</form>

В этой форме списке видно что данные которые пользователь может отправить нам это только значения от 0 до 2 . После того как пользователь выбрал значения например отправляем запрос в базу данных  следующего вида

select * FROM table_name WHERE sex = '$sex'

$sek это переменная которую принимает скрипт от пользователя, но перед этим, мы должны все входные данные правильно обработать

 

Обработчик.php

<?php
    switch ($_POST['sex']) {
        case 0:
            $sex = 0;
            break;
        case 1:
            $sex = 1;
            break;
        default:
           $sex = 2;
    }
?>

Смотрите, если передано значение 0, то переменной sek присваиваем 0, если 1 то 1, а во всех остальных случаях все попадает в переменную 2.

Надеемся данная статья поможет вам Спасибо.

 

 

 

Запись Php безопасность входных данных впервые появилась Developmen.

]]>
http://developmen.ru/php-bezopasnost-vxodnyx-dannyx/feed/ 0
Правильный robots.txt для сайта http://developmen.ru/pravilnyj-robots-txt-dlya-sajta/ http://developmen.ru/pravilnyj-robots-txt-dlya-sajta/#comments Tue, 16 Dec 2014 16:20:02 +0000 http://developmen.ru/?p=334 Правильный robots.txt для сайта. Здравствуйте, сегодня мы покажем вам как немного оптимизировать ваш блог, или сайт для этого на нужно создать robots.txt  который дает знать поисковому роботу что нужно индексировать что нельзя,  иногда нужно запретить индексацию некоторых файлов или каталогов а все это делается для быстрой индексации сайта блога.   Robots.txt Создадим файл с названием…

Запись Правильный robots.txt для сайта впервые появилась Developmen.

]]>
imgresПравильный robots.txt для сайта. Здравствуйте, сегодня мы покажем вам как немного оптимизировать ваш блог, или сайт для этого на нужно создать robots.txt  который дает знать поисковому роботу что нужно индексировать что нельзя,  иногда нужно запретить индексацию некоторых файлов или каталогов а все это делается для быстрой индексации сайта блога.

 

Robots.txt

Создадим файл с названием robots.txt b и положим его в корень вашего сайта внимание обезательно в корень сайта

User-agent: Yandex
Disallow: /cgi-bin
Disallow: /wp-admin
Disallow: /wp-includes
Disallow: /wp-content/plugins
Disallow: /wp-content/cache
Disallow: /wp-content/themes
Disallow: /wp-trackback
Disallow: /wp-feed
Disallow: /wp-comments
Disallow: */trackback
Disallow: */feed
Disallow: */comments
Host: site.ru


User-agent: *
Disallow: /cgi-bin
Disallow: /wp-admin
Disallow: /wp-includes
Disallow: /wp-content/plugins
Disallow: /wp-content/cache
Disallow: /wp-content/themes
Disallow: /wp-trackback
Disallow: /wp-feed
Disallow: /wp-comments
Disallow: */trackback
Disallow: */feed
Disallow: */comments
Sitemap: http://site.ru/sitemap.xml

Я сам использую этот robots.txt можете сами посмотреть robots.txt посмотреть

 

 

 

Запись Правильный robots.txt для сайта впервые появилась Developmen.

]]>
http://developmen.ru/pravilnyj-robots-txt-dlya-sajta/feed/ 0
Галерея фотографий на сайт http://developmen.ru/galereya-fotografij-na-sajt/ http://developmen.ru/galereya-fotografij-na-sajt/#comments Tue, 16 Dec 2014 15:42:14 +0000 http://developmen.ru/?p=325 Галерея фотографий на сайт. Здравствуйте читатели нашего блога сегодня мы поговорим о создании простой галерея фотографий для сайта, ее мы будем делать  с помощью html css и canvas. А сейчас мы расскажем вам что такое canvas. В html 5 имееться такой тег canvas он позволяет нам использовать хороший способ для работы с графикой  а также рисованием…

Запись Галерея фотографий на сайт впервые появилась Developmen.

]]>
Галерея фотографий на сайтГалерея фотографий на сайт. Здравствуйте читатели нашего блога сегодня мы поговорим о создании простой галерея фотографий для сайта, ее мы будем делать  с помощью html css и canvas. А сейчас мы расскажем вам что такое canvas. В html 5 имееться такой тег canvas он позволяет нам использовать хороший способ для работы с графикой  а также рисованием различных видов объектов конечно же

а также рисованием различных видов объектов конечно же с использованием Javascript. Рисование обьектов происходит в растровой  графике и так начнем

 

1. Html Разметка

Начнем мы пожалуй как всегда с простой html разметки наше галереи.

<div id="wrap">
<h1>Фотогалерея</h1>
    <ul id="gallery">
       <li><a href="#"><img src="images/flo1.jpg"><div>Весенние цветы 1</div></a></li>
       <li><a href="#"><img src="images/lights2.jpg"><div>Городские огни 1</div></a></li>
       <li><a href="#"><img src="images/flo3.jpg"><div>Весенние цветы 2</div></a></li>
       <li><a href="#"><img src="images/lights1.jpg"><div>Городские огни 2</div></a></li>
       <li><a href="#"><img src="images/flo2.jpg"><div>Весенние цветы 3</div></a></li>
       <li><a href="#"><img src="images/lights3.jpg"><div>Городские огни 3</div></a></li>
    </ul>
</div>

 

2. Css стили 

Будем использовать изображение 300px на 300px.

/* Стили для фотогалереи */
#wrap {width: 1020px; margin: 0 auto;} 
h1 {font-size:3em;margin:0 0 20px 20px;text-shadow:0 1px 0 #fff;}
/* Стили для каждого элемента маркированного списка */
li {
   float:left; 
   position:relative; 
   display:inline-block; 
   width:300px; 
   height:300px;
   margin:10px; 
   padding:10px; 
   background:#fff; 
   -webkit-box-shadow:0 0 5px rgba(0,0,0,.35);
   -moz-boz-shadow: 0 0 5px rgba(0,0,0,.35);
   box-shadow:0 0 5px rgba(0,0,0,.35);
}
/* Стили для блока DIV в котором находится название изображения */
li div {
   position:absolute;
   height:0; width:280px;
   background:rgba(0,0,0,.45); 
   overflow:hidden;
   bottom:10px;
   left:10px; 
   padding: 0 10px;
   -webkit-transition:height 1s;
   -moz-transition:height 1s;
   -o-transition:height 1s;
   -ms-transition:height 1s; 
   transition:height 1s;
   color:#fff;
   line-height:50px;
   font-size:1.2em;
}
li:hover div {height:50px;}

 

3. Canvas html5

Вот теперь мы начнем использовать html5 canvas для рисование оттенков серой версии наших изображений.

$(window).load(function() {
     $('#gallery img').each(function() {
       createCanvas(this);
     });

     function createCanvas(image) {
       var canvas = document.createElement('canvas');
       if (canvas.getContext) {

         var ctx = canvas.getContext("2d");
         // указать размер холста
         canvas.width = image.width;
         canvas.height = image.height;

         // Как только мы получим ссылку на объект исходного изображения, мы можем использовать DrawImage(ссылка, х, у), чтобы сделать ее Canvas. 
        // х, у являются координатами на целевом холсте, куда изображение должно быть помещено.
         ctx.drawImage(image, 0, 0);
         // Принимаем данные изображения и храним их в массиве ImageData. Вы можете узнать данные Канвас с помощью метода getImageData (). Данные изображения включают в себя цвет пикселя (в десятичной системе, RGB значения) и прозрачности (альфа-значение). Каждый цветовой компонент представляет целое число от 0 до 255. imageData.data содержит высота y ширина х 4 байта данных, с индексом в диапазоне от 0 до (высота y ширина х 4) -1.
         var imageData = ctx.getImageData(0, 0, canvas.width, canvas.height),
             pixelData = imageData.data;

         // Цикл по всем пикселям в массиве ImageData, RGB знаяения цвета.
         for (var y = 0; y < canvas.height; y++) {
           for (var x = 0; x < canvas.width; x++) {
             // Вы можете получить доступ к цвету значения (х, у) пикселя следующим образом:
             var i = (y * 4 * canvas.width) + (x * 4);
             // Получить RGB значения.
             var red = pixelData[i];
             var green = pixelData[i + 1];
             var blue = pixelData[i + 2];
             //  Преобразовать в оттенки серого. Одна из формул преобразования (например, вы могли бы попробовать простой средней (красный + зеленый + синий) / 3)  
             var grayScale = (red * 0.3) + (green * 0.59) + (blue * .11);
             pixelData[i] = grayScale;
             pixelData[i + 1] = grayScale;
             pixelData[i + 2] = grayScale;
           }
         }

         // Ввод изменений ImageData обратно на холст.
         ctx.putImageData(imageData, 0, 0, 0, 0, imageData.width, imageData.height);
         // Установка полотна в DOM:
         image.parentNode.insertBefore(canvas, image);
       }
     }
   });

 

4. Стили для Canvas html5

Здесь мы зададим эффекты для canvas такие как как будет выглядеть изображения в обычном состоянии и как оно будет выглядеть кода на него будут наводить курсор мыши то есть hover эффект

canvas {
   opacity:1; 
   position:absolute; 
   top:10px; 
   left:10px; 
   -webkit-transition:opacity 1s .2s;
   -moz-transition:opacity 1s .2s;
   -o-transition:opacity 1s .2s;
   -ms-transition:opacity 1s .2s;
   transition:opacity 1s .2s;
}
li:hover canvas {opacity:0;}

Вот и все Галерея фотографий на сайт  готова после нескольких выпоненых  действий мы получаем простую но красивую галерею для вашего  сайта.

Скачать исходник

 

 

 

Запись Галерея фотографий на сайт впервые появилась Developmen.

]]>
http://developmen.ru/galereya-fotografij-na-sajt/feed/ 0
Php пригодные кусочки кода http://developmen.ru/php-prigodnye-kusochki-koda/ http://developmen.ru/php-prigodnye-kusochki-koda/#comments Tue, 16 Dec 2014 14:40:07 +0000 http://developmen.ru/?p=318 Php пригодные кусочки кода. Добро пожаловать наш сайт Developmen в этой статье мы с вами поговорим о замечательных вставках php кода, которые вам пригодятся когда ни-будь,  немного расскажу вам зачем они нужны, например есть такой кусочек кода который позволит вам извлечь email адреса из обычного огромного текста разве это ни замечательно, или вот еще вы…

Запись Php пригодные кусочки кода впервые появилась Developmen.

]]>
Php пригодные кусочки кодаPhp пригодные кусочки кода. Добро пожаловать наш сайт Developmen в этой статье мы с вами поговорим о замечательных вставках php кода, которые вам пригодятся когда ни-будь,  немного расскажу вам зачем они нужны, например есть такой кусочек кода который позволит вам извлечь email адреса из обычного огромного текста разве это ни замечательно, или вот еще вы можете определить читателей вашего twiter  аккаунта, разве это не полезные кусочки кода

я думаю они вам пригодятся, я  думаю каждый выберет что ему будет нужно и так начнем

Вытащим email из текста

function extract_emails($str){
    // Это регулярное выражение извлекает все электронные письма из строки:
    $regexp = '/([a-z0-9_\.\-])+\@(([a-z0-9\-])+\.)+([a-z0-9]{2,4})+/i';
    preg_match_all($regexp, $str, $m);

    return isset($m[0]) ? $m[0] : array();
}
// Тестовый текст
$test_string = 'This is a test string...
        test1@example.org

        Test different formats:
        test2@example.org;
        <a href="test3@example.org">foobar</a>
        <test4@example.org>

        strange formats:
        test5@example.org
        test6[at]example.org
        test7@example.net.org.com
        test8@ example.org
        test9@!foo!.org
        foobar
';
// Получаем список адресов
print_r(extract_emails($test_string));

 

Определим число читателей twitter

function get_followers($twitter_id){
   $xml=file_get_contents('http://twitter.com/users/show.xml?screen_name='.$twitter_id);
   if (preg_match('/followers_count>(.*)</',$xml,$match)!=0) {
      $tw['count'] = $match[1];
   }

   return $tw['count'];
}
// Передаем функции имя пользователя, и узнаем количество читателей
$twitter = "XoZblog";
echo get_followers($twitter);

 

Временный url из обычной строки 

function create_slug($string){
   $string = strtolower($string);
   $slug=preg_replace('/[^a-z0-9-]+/', '-', $string);
   return $slug;
}
echo create_slug('Create Simple Slug URL')

 

 

Как узнать значение HEX in RGB

function hextorgb($hexvalue){
        if($hexvalue[0] == '#') {
                $hexvalue = substr( $hexvalue, 1);
        }
        if(strlen( $hexvalue ) == 6){
                list($r, $g, $b) = array($hexvalue[0] . $hexvalue[1], $hexvalue[2] . $hexvalue[3], $hexvalue[4] . $hexvalue[5]);
        }elseif (strlen($hexvalue) == 3) {
                list($r,$g,$b) = array($hexvalue[0] . $hexvalue[0], $hexvalue[1] . $hexvalue[1], $hexvalue[2] . $hexvalue[2]);
        }else{
                return false;
        }
        $r = hexdec($r);
        $g = hexdec($g);
        $b = hexdec($b);
        return array('R' => $r, 'G' => $g, 'B' => $b);
}
// Параметром для функции будет номер цвета
$rgb = hextorgb('#fff000');
print_r($rgb);

 

Кусочек кода который удаляет ссылки из текста 

$string = 'Это тестовая строка с ссылками: http://xozblog.ru и еще http://google.com';
$string = preg_replace('/\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|$!:,.;]*[A-Z0-9+&@#\/%=~_|$]/i', '', $string);
echo $string;

 

 

 

Запись Php пригодные кусочки кода впервые появилась Developmen.

]]>
http://developmen.ru/php-prigodnye-kusochki-koda/feed/ 0
PHP редирект с домена на домен http://developmen.ru/php-redirekt-s-domena-na-domen/ http://developmen.ru/php-redirekt-s-domena-na-domen/#comments Fri, 12 Dec 2014 14:48:55 +0000 http://developmen.ru/?p=293 PHP редирект с домена на домен. Здравствуйте в этой статья я покажу вам как сделать редирект, с одного доменного имени на другое доменное имя, то есть с сайта на сайт. Такой редирект чаще всего используют при переносе сайта на новый домен,  ставят редирект на старом домене и когда вы пытаетесь зайти на старый домен вас…

Запись PHP редирект с домена на домен впервые появилась Developmen.

]]>
PHP редирект с домена на доменPHP редирект с домена на домен. Здравствуйте в этой статья я покажу вам как сделать редирект, с одного доменного имени на другое доменное имя, то есть с сайта на сайт. Такой редирект чаще всего используют при переносе сайта на новый домен,  ставят редирект на старом домене и когда вы пытаетесь зайти на старый домен вас перекидывает на новый, также перекидывает и поисковых роботов

Index.php

<?
$ref=$_SERVER['QUERY_STRING'];
if ($ref!='') $ref='?'.$ref;
header('HTTP/1.1 301 Moved Permanently');
header('Location: http://newdomain.ru/'.$ref);
exit();
?>

Готово размешаем этот код на тот сайт с которого хотите перенаправлять пользователей. PHP редирект с домена на домен

 

 

 

Запись PHP редирект с домена на домен впервые появилась Developmen.

]]>
http://developmen.ru/php-redirekt-s-domena-na-domen/feed/ 0
Меняющийся фон страницы на js http://developmen.ru/menyayushhijsya-fon-stranicy/ http://developmen.ru/menyayushhijsya-fon-stranicy/#comments Fri, 12 Dec 2014 14:14:05 +0000 http://developmen.ru/?p=278 Меняющийся фон страницы на js. Здравствуйте, в этом уроке мы с вами сделаем  меняющийся фон страницы js  страницы, это значить наш фон на странице будет меняться через определенное время которое мы зададим, а также на какие картинки он будет менять, для этого мы будем использовать простую страницу html и скрипты javascript и так приступим к…

Запись Меняющийся фон страницы на js впервые появилась Developmen.

]]>
Меняющийся фон страницы на jsМеняющийся фон страницы на js. Здравствуйте, в этом уроке мы с вами сделаем  меняющийся фон страницы js  страницы, это значить наш фон на странице будет меняться через определенное время которое мы зададим, а также на какие картинки он будет менять, для этого мы будем использовать простую страницу html и скрипты javascript и так приступим к созданию нашего  меняющийся фон страницы js.

 

 

 

Первое что мы сделаем это создадим страницу html для нашей страницы

Index.html

<!Doctype html>
<html>
  <head>
    <title>Анимированный фон страницы</title>
    <meta charset="utf-8">
    <script src="background.js"></script>
  </head>
<body onLoad="setTimeout('changeBg()')"> //функция смена фона
  <h1>Анимированный фон страницы<h1>
</body>
</html>

Готово html страница готова теперь нам надо написать функцию для смены изображений

Background.js

<!--
 var bgrounds=new Array(
  "images/background/bg.jpg",
  "images/background/bg2.jpg",
  "images/background/bg3.jpg",);

function changeBg()
 {
 var i=Math.floor(bgrounds.length*Math.random());
 document.body.background=bgrounds[i];
 setTimeout('changeBg()',5000)
}
//-->

Готово толь ко не не забудьте поменять ссылки до ваших изображений

Меняющийся фон страницы js

 

Запись Меняющийся фон страницы на js впервые появилась Developmen.

]]>
http://developmen.ru/menyayushhijsya-fon-stranicy/feed/ 0