Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 29.12.2014, 16:24
Новичок на форуме
Отправить личное сообщение для maix Посмотреть профиль Найти все сообщения от maix
 
Регистрация: 29.12.2014
Сообщений: 6

Сдвинуть горизонтальный скролл в право на n пикселей
Доброго времени суток уважаемые форумчане. Подскажите пожалуйста по проблемке:

Есть некая разметка:
<div class="horiz_container_outer">
	<div class="horiz_container">
		<div class="block-timetable">DEVELOPING</div>
		<div class="block-timetable">DEVELOPING</div>
		<div class="block-timetable">DEVELOPING</div>
		<div class="block-timetable">DEVELOPING</div>
		<div class="block-timetable">DEVELOPING</div>
		<div class="block-timetable">DEVELOPING</div>
		<div class="block-timetable">DEVELOPING</div>
		<div class="block-timetable">DEVELOPING</div>
	</div>
</div>
<div onclick="qwerty();">BUTTON</div>


с некими стилями:

.horiz_container_outer{
	width:1140px;
	overflow:hidden;
	height:315px;
	position:relative;
	margin: 0 15px;
}

.horiz_container{
	width:4000px;
	height:300px;
	float:left;
}

.block-timetable{
	float: left;
	width: 500px;
	height: 300px;
	background: gray;
}


и js кодом
<script type="text/javascript">		
	$(document).ready(function(){
		function qwerty(){
			// вот тут нужен код который сдвигает скролл вправо
		}
	});
</script>



Какой прописать код в функции qwerty что бы по клику сдвигать скролл в право на n колличество пикселей ?
Заранее спасибо.
Ответить с цитированием
  #2 (permalink)  
Старый 29.12.2014, 16:44
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

у тебя функция qwerty не определена глобально, поэтому по клику на div получишь ReferenceError

по теме: https://developer.mozilla.org/en-US/...ent.scrollLeft
Ответить с цитированием
  #3 (permalink)  
Старый 29.12.2014, 17:16
Новичок на форуме
Отправить личное сообщение для maix Посмотреть профиль Найти все сообщения от maix
 
Регистрация: 29.12.2014
Сообщений: 6

Octane, спасибо тебе добрый человек ! и в право и в лево разобрался как. а вот на счет того что функция не определена, странно.. при обычном алерте ни какой ошибки не вылезает..
Ответить с цитированием
  #4 (permalink)  
Старый 29.12.2014, 17:38
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 10.07.2008
Сообщений: 3,873

ничего странного, ты ее определяешь внутри другой функции
…ready(function(){
Ответить с цитированием
  #5 (permalink)  
Старый 30.12.2014, 09:33
Новичок на форуме
Отправить личное сообщение для maix Посмотреть профиль Найти все сообщения от maix
 
Регистрация: 29.12.2014
Сообщений: 6

Octane, ясненько.. ок, а как ее определить глобально в таком случае ? как правильно ? если вынести из функции не рассматривать как вариант ?
Ответить с цитированием
  #6 (permalink)  
Старый 30.12.2014, 11:27
Профессор
Отправить личное сообщение для krasovsky Посмотреть профиль Найти все сообщения от krasovsky
 
Регистрация: 21.12.2012
Сообщений: 869

Сообщение от maix
ясненько.. ок, а как ее определить глобально в таком случае ? как правильно ? если вынести из функции не рассматривать как вариант ?
Естественно вынести за пределы ready(), либо объявлять как window.qwerty = function(){....}
Сейчас ты ее определил внутри jq функции ready,и она доступна только там, и только пока выполняется функция ready(). Такого вообще делать не стоит, разве что эта функция больше использоваться не должна.

Последний раз редактировалось krasovsky, 30.12.2014 в 11:30.
Ответить с цитированием
  #7 (permalink)  
Старый 30.12.2014, 11:29
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

maix,
назначить клик тамже где находится функция
$(document).ready(function(){
		function qwerty(){
			// вот тут нужен код который сдвигает скролл вправо
		} ;
        $("div.КЛАСС").click(qwerty)
	});
Ответить с цитированием
  #8 (permalink)  
Старый 30.12.2014, 11:39
Новичок на форуме
Отправить личное сообщение для maix Посмотреть профиль Найти все сообщения от maix
 
Регистрация: 29.12.2014
Сообщений: 6

Всем спасибо за ответы, разобрался =) Тема закрыта.
Ответить с цитированием
  #9 (permalink)  
Старый 31.12.2014, 10:36
Новичок на форуме
Отправить личное сообщение для maix Посмотреть профиль Найти все сообщения от maix
 
Регистрация: 29.12.2014
Сообщений: 6

Вот еще один вопросик появился =)

Из вышенаписанного получилось следущее:

<script type="text/javascript">
    document.addEventListener('DOMContentLoaded', function () {   
        var buttonright = document.getElementById('slide-right');
		var buttonleft = document.getElementById('slide-left');
        buttonright.onclick = function sright() {
			document.getElementById('horiz_container_outer').scrollLeft += 220;
        };
		buttonleft.onclick = function sleft() {
			document.getElementById('horiz_container_outer').scrollLeft -= 220;
        };
		
		setInterval(function(){document.getElementById('horiz_container_outer').scrollLeft += 220}, 3000)
		
    }, false);
</script>


Как узнать что скролл промотан до конца и поменять направление прокрутки ?
Заранее спасибо.
Ответить с цитированием
  #10 (permalink)  
Старый 31.12.2014, 11:34
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

maix,
Получить максимальное возможное значение scrollTop
Ответить с цитированием
Ответ


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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Горизонтальный скролл дива с позицией fixed sashgera Элементы интерфейса 4 06.12.2014 02:21
FancyBox переопределяет вертикальный скролл ? ilyas-> Элементы интерфейса 14 08.11.2014 16:55
Горизонтальный скролл бар в ФФ Kepa (X)HTML/CSS 3 18.12.2010 22:44
Горизонтальный скролл на Mootools1.1 Virgile Events/DOM/Window 4 10.07.2010 18:42