Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 20.08.2016, 18:42
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,112

laimas,
<!DOCTYPE html>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .slider{
     position: relative;
     width: 640px;
     height: 480px;
  }
  .slider *{
    display: block;
    position: absolute;
    left: 0;
    top: 0;
  }
  .slider a {
    z-index: 1;
  }

  .slider a:first-child {
    z-index: 10;
  }
  .slider a:nth-child(2) {
    z-index: 5;
  }
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script>
    $(function () {

            !function f() {
            $('.slider a:first-child').delay(3000).fadeTo(500, 0, function() {
                $(this).appendTo('.slider').css({opacity:1});f();
            })
            }()

    });
  </script>
</head>

<body>
<div class="slider">
    <a href="#"><img src="http://www.fonstola.ru/pic/201303/640x480/fonstola.ru-91576.jpg" alt="Img 1" /></a>
    <a href="#"><img src="http://files.vividscreen.info/soft/368b834b2d1a426882a89edab24232e9/Autumn-Forest-640x480.jpg" alt="Img 2" /></a>
    <a href="#"><img src="http://www.allfons.ru/pic/201201/640x480/allfons.ru-4352.jpg" alt="Img 3" /></a>
    <a href="#"><img src="http://uvdhmao.ru/upload/iblock/a6e/a6e740a7fa90f2aae6f1ac0dcd5ec5cf.jpg" alt="Img 4" /></a>
</div>
</body>
</html>
Ответить с цитированием
  #12 (permalink)  
Старый 20.08.2016, 18:52
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

В этом смысле. Можно, но это же не удаление таймера, а лишь "визуальная" замена записи setInterval на delay
Ответить с цитированием
  #13 (permalink)  
Старый 20.08.2016, 18:59
Новичок на форуме
Отправить личное сообщение для pankrat Посмотреть профиль Найти все сообщения от pankrat
 
Регистрация: 20.08.2016
Сообщений: 9

Ребят большое спасибо всем вам за помощь с проблемой ссылок разобрался и понял, но вот со стилями(( иза них не отображается не чего

.slider {
    position:relative;
    width: 94%;
    max-width: 1180px;
    height: 100%;
	margin:20px 3% 10px;
    height:412px;
}

.slider a{
	position: absolute;
}

.slider img {
    position:absolute;
    background-color: #f3f4ef;
    border: 1px solid #dedede;
    padding: 5px;
    box-shadow: 0 0 9px #000;
}
Ответить с цитированием
  #14 (permalink)  
Старый 20.08.2016, 19:14
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,112

Сообщение от laimas
"визуальная" замена записи setInterval
неа тама сейчас requestAnimationFrame
Ответить с цитированием
  #15 (permalink)  
Старый 20.08.2016, 19:14
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,112

pankrat,
смотрите другое css это никак не влиет
Ответить с цитированием
  #16 (permalink)  
Старый 20.08.2016, 19:15
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,112

pankrat,
<!DOCTYPE html>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .slider {
    position:relative;
    width: 94%;
    max-width: 1180px;
    height: 100%;
  margin:20px 3% 10px;
    height:412px;
}

.slider a{
  position: absolute;
}

.slider img {
    position:absolute;
    background-color: #f3f4ef;
    border: 1px solid #dedede;
    padding: 5px;
    box-shadow: 0 0 9px #000;
}

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script>
    $(function () {

            !function f() {
            $('.slider a:first-child').delay(3000).fadeTo(500, 0, function() {
                $(this).appendTo('.slider').css({opacity:1});f();
            })
            }()

    });
  </script>
</head>

<body>
<div class="slider">
    <a href="#"><img src="http://www.fonstola.ru/pic/201303/640x480/fonstola.ru-91576.jpg" alt="Img 1" /></a>
    <a href="#"><img src="http://files.vividscreen.info/soft/368b834b2d1a426882a89edab24232e9/Autumn-Forest-640x480.jpg" alt="Img 2" /></a>
    <a href="#"><img src="http://www.allfons.ru/pic/201201/640x480/allfons.ru-4352.jpg" alt="Img 3" /></a>
    <a href="#"><img src="http://uvdhmao.ru/upload/iblock/a6e/a6e740a7fa90f2aae6f1ac0dcd5ec5cf.jpg" alt="Img 4" /></a>
</div>
</body>
</html>
Ответить с цитированием
  #17 (permalink)  
Старый 20.08.2016, 19:16
Новичок на форуме
Отправить личное сообщение для pankrat Посмотреть профиль Найти все сообщения от pankrat
 
Регистрация: 20.08.2016
Сообщений: 9

Сообщение от рони Посмотреть сообщение
pankrat,
смотрите другое css это никак не влиет
Только эта часть css отвечает у меня за вывод этого слайдера
Ответить с цитированием
  #18 (permalink)  
Старый 20.08.2016, 19:27
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от рони
тама сейчас requestAnimationFrame
Для новых браузеров да, да и то зоопарк. )
Ответить с цитированием
  #19 (permalink)  
Старый 20.08.2016, 19:54
Новичок на форуме
Отправить личное сообщение для pankrat Посмотреть профиль Найти все сообщения от pankrat
 
Регистрация: 20.08.2016
Сообщений: 9



Вот как отображается,
Сайт onlajn-smotret.инфо
Подскажите пожалуйста где косяк?
Ответить с цитированием
  #20 (permalink)  
Старый 20.08.2016, 19:56
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,112

pankrat,
а нормально ссылку дать?
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Ссылка и картинка Step48_rus jQuery 10 08.08.2016 12:24
Ссылка на окружности и картинка Ваня98 Общие вопросы Javascript 2 12.01.2016 19:34
Ссылка + картинка + трехцветная рамка + IE greatilya (X)HTML/CSS 7 08.09.2011 08:58
ссылка и картинка Артем125 (X)HTML/CSS 8 01.08.2010 00:44
Подскажите по CSS меню Александр_1988 Элементы интерфейса 1 17.05.2010 11:58