Changing CSS content property dynamically

后端未结

关注

 2  917

A friend of mine is renting a webshop from a company. He is able to choose from different templates, and has the ability to override the predefined CSS and add javascript sn

相关标签:

2条回答

北恋

2021-01-17 07:33

Try this:

HTML:

<html lang="en">
...
<div id="add_to_cart" data-content="">example</div>

CSS:

#add_to_cart:before {
    display: block;
    font-size: 35px;
    content: attr(data-content);
    padding-right: 5px;
    font-weight: 400;
    width: 71px;
    height: 71px;
    line-height: 65px;
    text-align: center;
    text-indent: 0;
    text-shadow: none;
    color: red;
}

JS:

$('#add_to_cart').attr('data-content', (document.documentElement.lang == 'en' ? "x" : "y"));

You'll see that the character before 'example' changes when lang attr of <html> is changed.

0 讨论(0)

无人及你

2021-01-17 07:51

Write a Javascript function that updates the CSS. Javascript can access the HTML attribute.

document.documentElement.lang

0 讨论(0)
发布评论:

提交评论
- 加载中...