Обновить данные-атрибут при изменении размера окна

Question

Обновить данные-атрибут при изменении размера окна

0

Мне нужно записать в div некоторые пользовательские атрибуты данных, такие как:

data-100="50"

где "100" - это высота другого div, а "50" - "высота /2". Я сделал это с помощью jQuery, и он работает:

function customFn() {
var customFn = $('.page-title').height();     
$('#header).attr('data-' + customFn, 'customFn/2');        
}

customFn();

Теперь я хочу обновить эти значения при изменении размера окна, поэтому я добавил:

$(window).resize(customFn);

Но я думаю, что это не решение, потому что, когда я изменяю размер окна, функция добавляет новые атрибуты данных внутри div с новыми значениями вместо обновления существующих.

Есть ли альтернативное решение для этого?

user1861373 02 дек. 2013, в 12:29

Источник

0

Вы не должны хранить информацию в части имени атрибута. Почему бы просто не использовать атрибут вроде data-height = "100". И вы можете определенно сделать деление (/ 2) в коде, вам не нужно добавлять это к атрибуту.
Esko 02 дек. 2013, в 10:43
1

К сожалению, мне нужно хранить информацию об именной части атрибута, потому что я пытаюсь заставить работать [плагин skrollr] ( github.com/Prinzhorn/skrollr ) для большего контроля над поведением параллакса. :(
user1861373 02 дек. 2013, в 10:53

Теги:

javascript

jquery

html5

3 ответа

Ещё вопросы

Вы не должны хранить информацию в части имени атрибута. Почему бы просто не использовать атрибут вроде data-height = "100". И вы можете определенно сделать деление (/ 2) в коде, вам не нужно добавлять это к атрибуту.
К сожалению, мне нужно хранить информацию об именной части атрибута, потому что я пытаюсь заставить работать [плагин skrollr] ( github.com/Prinzhorn/skrollr ) для большего контроля над поведением параллакса. :(

Antegeia · Answer 1 · 2013-12-02T10-07-00.000Z

Можете ли вы попробовать это?

$(window).resize(function() {
   customFn();
});

Samuel · Answer 2 · 2013-12-02T09-07-00.000Z

Насколько я понимаю, вы пытаетесь сохранить два значения: высота и высота /2. Вы не должны хранить первый в имени атрибута data... скорее сохраните оба в отдельном атрибуте, например:

function customFn() {
    var height = $('.page-title').height();     
    $('#header').data('height', height);        
    $('#header').data('half-height', height/2);      
}

Еще лучше, поскольку одно значение зависит от другого (value1 = value/2), вам действительно нужно только сохранить первый, и при необходимости может вычислить второе.

Adil · Answer 3 · 2013-12-02T08-47-00.000Z

Не используйте attr() для обновления данных, а используйте data()

function customFn() {
    var customFn = $('.page-title').height();     
    $('#header').data(customFn, customFn/2);      
}