jQuery ui effect () перезаписывает CSS

Question

jQuery ui effect () перезаписывает CSS

0

Я пытаюсь использовать jQuery ui effect(), чтобы сделать div div вверх. Во время анимации размер шрифта div установлен на 100%, но мой оригинальный CSS имеет размер шрифта: 40 пикселей. Благодаря тому, что анимация двигалась очень медленно, мне удалось узнать, что во время анимации метод добавляет обертку div поверх моего div, а оберточный div выглядит так:

<div class="ui-effects-wrapper" style="font-size: 100%; background-color: transparent; border: none; margin: 0px; padding: 0px; position: relative; width: 1150px; height: 64px; float: none; overflow: hidden;">

Атрибут style-size: 100% style заменяет мой оригинальный CSS для целевого div. Теперь, конечно, я могу добавить! Важно для моего CSS, поэтому он не будет перезаписан, но я хотел бы знать, есть ли другой способ сделать это более законно, чем грубо добавить! Важно для CSS. Кроме того, я хотел бы знать, в чем причина добавления "font-size: 100%" в div wrapper.

Заранее благодарны за Вашу помощь.

shenkwen 15 апр. 2014, в 23:01

Источник

1

CSS вашего внутреннего элемента div должен иметь приоритет перед элементом div. Вы применяете свои стили к этому div или к какому-то предку?
isherwood 15 апр. 2014, в 21:06
0

Понимаю. Я использую некоторый непосредственный дочерний селектор для управления CSS внутреннего div. Теперь, когда div обёртки добавлен, селектор устарел. Спасибо за помощь.
shenkwen 15 апр. 2014, в 21:16

Теги:

jquery

2 ответа

Ещё вопросы

CSS вашего внутреннего элемента div должен иметь приоритет перед элементом div. Вы применяете свои стили к этому div или к какому-то предку?
Понимаю. Я использую некоторый непосредственный дочерний селектор для управления CSS внутреннего div. Теперь, когда div обёртки добавлен, селектор устарел. Спасибо за помощь.

Rainhider · Answer 1 · 2016-04-05T13-27-00.000Z

оболочка ui-effects - это боль, чтобы попытаться переопределить... я использовал следующее с элементом i, который пытался установить ширину для:

<div class="menuContainer"> //this is what the .ui-effects-wrapper acts on
  <div class="menuItem"></div>
  <div class="menuItem"></div>
  <div class="menuItem"></div>
</div>

Я не мог перезаписать оболочку.ui-effects-wrapper, поэтому вот что я сделал для работы с ней.

in css page:
.menuContainer  {  
   top: 160px;
   position: absolute; //important to have
   height: 385px;
   width: 400px;  
   overflow-x: hidden; //this made the width "appear" like it stayed at 400px as is set above.
}

.menuItem {
    width: inherit; //and now everything is 400px and the css doesn't show the    extra crazy that the .ui-effects-wrapper was giving it.
    height: 10%; // made each item 10% of the menuContainer height. I adjusted to where it looked right based on my font selection, padding, etc
}

Dario Chuquilla · Answer 2 · 2015-01-22T22-15-00.000Z

Добавьте это в свой файл css

.ui-effects-wrapper{overflow-x: visible !important; width: 100% !important; }