Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   backgroundImage в методе .css() (https://javascript.ru/forum/jquery/39424-backgroundimage-v-metode-css.html)

Алек 29.06.2013 14:29

backgroundImage в методе .css()
 
Добрый день всем!
У меня проблема такая, я не могу заменить backgroundImage методом .css().
Я пишу:
$('.end_of_days').css({'backgroundImage':'url("../images/moto3.jpg")',
	'border':'1px solid red'
	});


Рамка появляется, но сам backgroundImage не меняется. В css ему прописаны правила background-image: url('../images/moto1.jpg');
Может я записал не так, гуглил, но ничего по этому поводу найти не смог.

Заранее большое спасибо.

mta88 29.06.2013 14:50

а у меня работает:)
вангую, что браузер не может найти фотографию

Алек 29.06.2013 15:06

Я пробовал на фаерфоксе, хроме и опере, в том и дело что они не могут изображение найти. Вот только почему?
В таблице стилей изменяю правила для этого блока, всё работает, так что пути правильные, я подозреваю что сама запись
.css({'backgroundImage':'url("../images/moto3.jpg")'});

не верно записана.
Но как тогда ей записать верно?

рони 29.06.2013 15:26

Алек,
всё у вас верно если картинка именно там
<!DOCTYPE HTML>
<html>
<head>
  <title>Untitled</title>
<base href="http://javascript.ru/forum/images/">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head>
<body>
<script>
$('body').css({'backgroundImage':'url("../images/ca_serenity/misc/logo.gif")',
    'border':'1px solid red'
    });
</script>
</body>
</html>

mta88 29.06.2013 15:27

и тем не менее это у меня работает и везде должно работать:)
я уверен что ваш скрипт просто запутался в папках
попробуйте заменить относительный путь на абсолютный например
или поискать ошибки в firebug или chrome dev tools

вот как я сделал

файлы
  • ddd/index.html
  • photos/img.jpg
  • jquery.js

ddd/index.html
<!doctype html>
<html>
<head>
  <script src="/jquery.js"></script>
  <script>
  $(function() {
    $('.ccc').css({'backgroundImage': 'url("../photos/img.jpg")'});
  });
  </script>
  <style>
  .ccc {
    width: 100px;
    height: 100px;
  }
  </style>
</head>

<body>
  <div class="ccc"></div>
</body>
</html>

Алек 29.06.2013 16:00

Спасибочки!:) Разобрался,
оказалось путь не верный, мне же не надо на уровень выше было подниматься, как в стилях, вот правильная запись такая:
$('.end_of_days').css({'backgroundImage':'url("images/moto4.jpg")'});

Оказалось ../ здесь как лишняя запись.
Осталось только условия прописать для события click(), спасибо.

danik.js 29.06.2013 16:10

В css файлах путь указывается относительно css файла, а в html-документе - путь относительно документа.

Алек 29.06.2013 16:33

Да, действительно css файлы лежат в отдельной папке, поэтому когда меняю пути в css файлы из неё нужно выйти, а html файлы находятся не в папке, поэтому ../ выходить не от куда.
Посмотрел сейчас сгенерированный Веб девелопером код, вся работа происходит в html файле:
<div style="background-image: url(&quot;images/moto1.jpg&quot;);" class="end_of_days">
						<p style="left: 100px;" class="news_end">Мотоцикл</p>

Я просто думал что метод .css() работает с таблицей стилей.


Часовой пояс GMT +3, время: 10:17.