Привет! Если вы читаете это - Вы еще не зарегистрированы. Это займет не больше минуты. Нажмите здесь, чтобы пройти регистрацию в несколько простых шагов, чтобы пользоваться всеми возможностями нашего форума. Обратите внимание, запрещены непристойные, матерные, бессмысленные (цифры, случайный набор букв) ники. Удачи!

Тема: [Вопрос] Как сделать меняющийся background

Показано с 1 по 2 из 2

  1. #1
    Пользователь

    Аватар для sOflY

    Статус: Оффлайн
    Регистрация:22.10.2011
    Сообщений:2,762
    Репутация:714 [+/-] 

    [Вопрос] Как сделать меняющийся background

    Думаю вопрос понятен. Как сделать меняющийся background либо при обновлении страницы, либо, если так можно в опр. промежуток времени background будет меняться, если так можно.
  2. #2
    Пользователь

    Аватар для aleks63

    Статус: Оффлайн
    Регистрация:25.06.2011
    Адрес:Los Angeles
    Сообщений:2,258
    Репутация:678 [+/-] 
    При обновлении страницы - посредством PHP (Рандомно):

    PHP код:
    <?php
        $background 
    = array ('Адрес/цвет BG №1','Адрес/цвет BG №2','Адрес/цвет BG №3','Адрес/цвет BG №4');
    ?>
    <body style="background: url('<?php echo $backgroundrand0count$background ) ) ];?>');">
    Если используете цвет - уберите url('').

    Если хотите чтобы bg менялся без перезагрузки страницы - в помощь JavaScript 2-Way Background Images SlideShow.

    Код авторского js:

    Код:
    ============================================================
    Script:     2-Way Background Images SlideShow
                Positionable Images or Full Page-Space Display
    
    Functions:
    
    Runs an image slideshow in the background of the page,
    underneath the page content. Used with the accompanying
    sytle script, images are discretely positionable in the page
    space, just like a regular slideshow. Leave out the style
    script, and the slideshow runs with full page-space
    presentation.
       
    Browsers:  IE 4.0+ or NS 6.0 (degrades gracefully in others)
    
    Author:    etLux
    ============================================================
    
    -------------------------------
    Step One: Installing the Script
    -------------------------------
    
    <script language="JavaScript">
    <!--
    
    // (C) 2003 CodeLifter.com
    // Free for all users, but leave in this  header
    
    // =======================================
    // set the following variables
    // =======================================
    
    // Set speed (milliseconds)
    var speed = 1000
    
    // Specify the image files
    var Pic = new Array() // don't touch this
    // to add more images, just continue
    // the pattern, adding to the array below
    
    Pic[0] = 'ССЫЛКА НА ИЗОБРАЖЕНИЕ BG №1'
    Pic[1] = 'ССЫЛКА НА ИЗОБРАЖЕНИЕ BG №2'
    Pic[2] = 'ССЫЛКА НА ИЗОБРАЖЕНИЕ BG №3'
    Pic[3] = 'ССЫЛКА НА ИЗОБРАЖЕНИЕ BG №4'
    Pic[4] = 'ССЫЛКА НА ИЗОБРАЖЕНИЕ BG №5'
    
    // =======================================
    // do not edit anything below this line
    // =======================================
    
    var t
    var j = 0
    var p = Pic.length
    
    var preLoad = new Array()
    for (i = 0; i < p; i++){
       preLoad[i] = new Image()
       preLoad[i].src = Pic[i]
    }
    
    function runBGSlideShow(){
       if (document.body){
       document.body.background = Pic[j];
       j = j + 1
       if (j > (p-1)) j=0
       t = setTimeout('runBGSlideShow()', speed)
       }
    }
    
    //-->
    </script>
    
    
    
    --------------------------------
    Step Two: Starting the SlideShow
    --------------------------------
    
    Modify your <body> tag to add the following onload event
    
    <body onload="runBGSlideShow()">
    
    
    
    ----------------------------------------
    Step Three:  Installing the Style Script
    ----------------------------------------
    
    Method One - Positionable Images
    ----------
    
    Put the following style sheet in the <head> of
    your page.  Normally it will go *before* the script above.
    
    <style>
    body{
    background-repeat: no-repeat;
    background-position: 200 100;
    }
    </style>
    
    Set the position x y in pixels in the background-position
    element to position the images in the page.  Do not use
    commas between the values!
    
    
    Method Two - Full Page-Space Background
    ----------
    
    Easy - just omit the style script above from the page.
    The background images will then repeat across the page, as
    usual.
    
    ============================================================

Ваши права

  • Вы не можете создавать новые темы
  • Вы не можете отвечать в темах
  • Вы не можете прикреплять вложения
  • Вы не можете редактировать свои сообщения