JQuery включает в себя CSS - PullRequest
Новая
       31

JQuery включает в себя CSS

0 голосов
/ 14 июня 2010

Как добавить стили CSS внутри <body> или <head>, поместив в файл javascript следующим образом: 

<style type="text/css">
    .popup-bg {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: #eee;
    }
</style>

Единственный способ - написать css внутри javascript, нет доступа к html или любому внешнему css.

Спасибо.

Ответы [ 6 ]

2 голосов
/ 14 июня 2010

ЕСЛИ класс определяется в вашей структуре / разметке вместе с классом, то: 

$(".popup-bg").css({ position: fixed, 
        left: 0, 
        top: 0, 
        width: 100%, 
        height: 100%, 
        background: #eee 
 });

ИЛИ, чтобы добавить его к определенному тегу: 

    $("body").css({ position: fixed,  
            left: 0,  
            top: 0,  
            width: 100%,  
            height: 100%,  
            background: #eee  
     });

И ввести его: 

var style = document.createElement('style'); 

style.innerText = '.popup-bg{ position: fixed,  
            left: 0,  
            top: 0,  
            width: 100%,  
            height: 100%,  
            background: #eee  
     }'; 

document.head.appendChild(style);
1 голос
/ 13 августа 2012

У вас также может быть функция, которая добавляет класс в тело, что означает, что все CSS на этой странице могут обнаружить этот класс 

if (device.platform == "iPhone" || device.platform == "iPhone Simulator")
{
     $("body").addClass('iPhone');
}

В заголовке или в файле .css вы можете ссылаться на изменение, не имея стилей CSS в javascript. 

<style type="text/css">
    body.iPhone .popup-bg {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: #eee;
    }
</style>
1 голос
/ 14 июня 2010

Вы можете создать <style> элементы, добавить их в документ, а затем использовать 

 $('#styleId').text('.something { display: none; }');

или что угодно. 

 $('body').append($('<style/>').attr("id", "myNewStyle"));
 $('#myNewStyle').text('.something { whatever: 10px; }');

Вы можете добавить свои блоки стиля к голове, если хотите.

edit & mdash; блок многострочного стиля: 

 $('#myNewStyle').text(
 ' .something { ' +
 '    font-size: 12px; ' +
 '    font-weight: normal; ' +
 '    color: #e0f0e0; ' +
 ' }'
 );
1 голос
/ 14 июня 2010

Использование addClass метод jquery: 

$('body').addClass('popup-bg');

Обновление: 

  $(function(){
    $('head').append('
      <style type="text/css">
        .popup-bg {
            position: fixed;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background: #eee;
        }
      </style>
    ');
  });
0 голосов
/ 14 июня 2010

Вы можете использовать что-то вроде $('body').addClass('popup-bg');

0 голосов
/ 14 июня 2010 
$('body').addClass('popup-bg');

Поскольку гарантированно будет только один элемент body, выбор самого элемента работает.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...