Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 26.10.2011, 13:41
Новичок на форуме
Отправить личное сообщение для optimismous Посмотреть профиль Найти все сообщения от optimismous
 
Регистрация: 14.11.2010
Сообщений: 4

изменить положение бэкграунда относительно центра
Здравствуйте все. Имеется див с таким стилем:
div.bg {
background-position: center top;
}

Подскажите, пожалуйста, можно ли с помощью jquery сместить его текущую позицию по горизонтали на заданное количество пикселей?
Ответить с цитированием
  #2 (permalink)  
Старый 26.10.2011, 14:33
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от optimismous
можно ли с помощью jquery сместить его текущую позицию по горизонтали на заданное количество пикселей?
ЖиКвери тут не при чём... Позицию бекграунда можно лишь указать. Сместить относительно ч.л. - нет.

Как вариант саму картинку сделать "кособокой"... Тогда при центрировании она будет смотреться смещёной относительно центра.
Ответить с цитированием
  #3 (permalink)  
Старый 26.10.2011, 14:52
Аватар для walik
Профессор
Отправить личное сообщение для walik Посмотреть профиль Найти все сообщения от walik
 
Регистрация: 09.11.2009
Сообщений: 1,101

Сообщение от optimismous
Подскажите, пожалуйста, можно ли с помощью jquery сместить его текущую позицию по горизонтали на заданное количество пикселей?
Можно
<!DOCTYPE HTML>
<html>
  <head>   
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script> 
  </head>
  <body>
<div id="a"></div>
<button onclick="a();">Click</a>
<script>
function a() {
  $('#a').css({backgroundPositionX: '+=50px'});
}
</script>
<style>
#a {
  width: 200px;
  height: 50px;
  background-image: url(http://javascript.ru/forum/images/smilies/smile.gif);
  background-repeat: no-repeat;
  background-position: center top;
  border: 1px solid black;
}
</style>
  </body>
</html>
__________________
"Всегда пишите код так, будто сопровождать его будет склонный к насилию психопат, который знает, где вы живете."
Мой сертификат :-D клацай
Ответить с цитированием
  #4 (permalink)  
Старый 26.10.2011, 19:42
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от walik
Можно
Давлю на кнопку (у меня Опера) - эфекта ноль.
Ответить с цитированием
  #5 (permalink)  
Старый 26.10.2011, 19:44
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

В ФФ - ноль...
Ответить с цитированием
  #6 (permalink)  
Старый 26.10.2011, 19:49
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Да и тут
http://jquery-docs.ru/css/css/

Про такое '+=50px' нет ни слова...
Ответить с цитированием
  #7 (permalink)  
Старый 26.10.2011, 20:27
Аватар для walik
Профессор
Отправить личное сообщение для walik Посмотреть профиль Найти все сообщения от walik
 
Регистрация: 09.11.2009
Сообщений: 1,101

Сообщение от ksa
Давлю на кнопку (у меня Опера) - эфекта ноль.
Сообщение от ksa
В ФФ - ноль...
Возможно, тестил только в хроме)))

Сообщение от ksa
Да и тут
http://jquery-docs.ru/css/css/

Про такое '+=50px' нет ни слова...
Опять же - смотрим в официальной документации
Это означает что к текущему значению добавить еще 50 пикселей
__________________
"Всегда пишите код так, будто сопровождать его будет склонный к насилию психопат, который знает, где вы живете."
Мой сертификат :-D клацай
Ответить с цитированием
  #8 (permalink)  
Старый 26.10.2011, 20:51
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от walik
Это означает что к текущему значению добавить еще 50 пикселей
Смысл-то я понял... Но вот не работает только это там, где я пробовал...
Ответить с цитированием
  #9 (permalink)  
Старый 27.10.2011, 08:28
Аватар для Snipe
Профессор
Отправить личное сообщение для Snipe Посмотреть профиль Найти все сообщения от Snipe
 
Регистрация: 06.05.2008
Сообщений: 765

<!DOCTYPE HTML>
<html>
  <head>  
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
  </head>
  <body>
<div style="border:1px solid red">
<div id="a"></div>
</div>
<button onclick="a();">Click</a>
<script>
function a() {
  $('#a').css('marginBottom', '-10px');
  $('#a').css('paddingBottom', '10px');
}
</script>
<style>
#a {
  width: 200px;
  height: 90px;
  background-image: url(http://javascript.ru/forum/images/smilies/smile.gif);
  background-repeat: no-repeat;
  background-position: center center;
  /*border: 1px solid black;*/
}
</style>
  </body>
</html>

Последний раз редактировалось Snipe, 27.10.2011 в 10:10.
Ответить с цитированием
  #10 (permalink)  
Старый 27.10.2011, 08:54
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Snipe, это не интересно... Ты просто установил другое значение, а не "сместил относительно центра".


<!DOCTYPE HTML>
<html>
  <head>  
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
  </head>
  <body>
<div id="a"></div>
<button onclick="a();">Click</a>
<script>
function a() {
  $('#a').css('backgroundPosition', 'center 10px');
}
</script>
<style>
#a {
  width: 200px;
  height: 120px;
  background-image: url(http://javascript.ru/forum/images/smilies/smile.gif);
  background-repeat: no-repeat;
  background-position: center center;
  border: 1px solid black;
}
</style>
  </body>
</html>
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как изменить положение окна facebox? lukingnu jQuery 0 30.03.2011 14:23
Как изменить положение scroll? PAMAC Общие вопросы Javascript 3 25.11.2010 18:22
Как изменить положение scrollbara PAMAC Общие вопросы Javascript 2 15.02.2010 12:03
Изменить положение меню Тля Элементы интерфейса 1 27.07.2009 13:44
Изменить положение курсора textarea demi Events/DOM/Window 3 11.03.2009 11:05