2015-04-23 4 views
0

Я подозреваю, что это невозможно, но я ищу подтверждение. У меня есть ряд элементов изображения, которые добавляются как id в div. Я пытаюсь прикрепить еще одно маленькое изображение к первому. Поскольку контейнер различается по ширине на основе содержимого игры пользователя, прикрепление его к контейнеру не дало последовательных результатов. Мое изображение хранится как класс в главном файле css.Добавить класс в динамически сгенерированный элемент с помощью css

Есть ли способ использовать :: before для присоединения класса к элементу, который динамически генерируется?

Я глубоко обескуражен моим менеджером от использования javascript для этой конкретной задачи.

Большое спасибо.

ответ

-1

Вы можете использовать в jQuery что-то вроде $(your_element).addClass(your_class)

+1

Моя вся проблема в том, что я не могу использовать Javascript для выполнения этой задачи, если это не является абсолютным последним средством. – fstopzero

+0

О, ничего себе плохо, я читаю ободренный, извините. Тогда да, попробуйте использовать CSS, как указано выше, но я действительно думаю, что использование JS - лучший способ пойти. – Pleasure

+0

Я согласен, что это будет лучший способ. Мой босс этого не делает. – fstopzero

2

Вы не можете добавить класс с помощью CSS ....

Но вы могли бы использовать: перед тем, чтобы показать псевдо изображение, которое вы пытаетесь Добавить.

div#this-id { 
 
    position: relative; 
 
    width: 300px; 
 
    height: 200px; 
 
    background: blue; 
 
} 
 
div#this-id:before { 
 
    content: ""; 
 
    position: absolute; 
 
    top: 0; 
 
    left: 0; 
 
    width: 50px; 
 
    height: 200px; 
 
    background: url(image-folder/image/jpg) no-repeat 0 0 #f00; 
 
}
<div id="this-id"></div>

+0

Это отличный ответ, и я собираюсь его продвинуть, но я должен использовать класс по стандартам компании. – fstopzero

+0

, то замените идентификатор на класс изображения, это будет работать одинаково – Aaron

+0

Я имею в виду, что изображение хранится как класс, и именно так должно быть указано в этой кодовой базе по стандартам компании. – fstopzero

1

Я не думаю, что вы можете добавить имя класса с помощью CSS, но вы можете просто использовать selector:pseudo-class для него, пример ниже, чтобы использовать .container:before как имя реального класса.

.container:before { 
 
    content: url("http://lorempixel.com/50/50"); 
 
}
<div class="container"> 
 
    <img src="http://lorempixel.com/100/100" /> 
 
    <img src="http://lorempixel.com/150/150" /> 
 
</div>

Fiddle Демо:http://jsfiddle.net/dh6ynq32/ (с некоторыми пользовательских стилей)

Смежные вопросы