Просто математический синтаксис JQuery - как мне вычесть?

Привет замечательное сообщество,

Я пытаюсь сделать действительно простую математику с JQuery, но я не могу найти чит-код с математическим синтаксисом (это имеет отношение к тому, что я пытаюсь сделать). Я умею складывать и умножать, но вычитание ускользает от меня!

Что мне нужно сделать, так это назначить стиль "#photo" со значением (общая ширина области просмотра - (241px + (высота * 0,32))). Этот код успешно получает общую ширину окна просмотра и назначает ее шириной #photo:

$(document).ready(function(){
    var width = $(window).width(); 
    $('#photo').css('width', width);
});

Но ничего из того, что я пробовал ('width', (width- (value + value))) не сработало - может кто-нибудь сообщить мне, каков синтаксис для вычитания и вложенных уравнений?

ИЛИ, вместо того, чтобы снова вычислять (высота * 0,32), как мне назначить вывод (высота * 0,32) переменной, чтобы я мог повторно использовать ее, сделав расчет ширины примерно таким ('ширина', (ширина- ( 281px - варнейм)))?

Вот вся функция, включая вычисление (высота * 0,32):

$(document).ready(function(){
    var height = $(window).height();
    var width = $(window).width(); 
    $('#menu').css('height', height);
    $('#menu').css('width', (height*0.29));
    $('#menu').css('position','fixed');
    $('#menu').removeClass('nojavascript');
    $('#novel').css('padding-left', (height*0.32));
    $('#novel').removeClass('nojavascript');
    $('#photo').css('width', width);
});

Э-э, дополнительные советы о том, как привести в порядок мой код, также приветствуются. Просто глядя на него, я могу догадаться о некоторых вещах, которые вполне могут быть ненужным дублированием!

Отредактировано по запросу: вот проблема вычитания, над которой я сейчас работаю:

  $('img').css('width', (width - (281+(height*0.32))) + 'px');

Теперь проблема, с которой я борюсь, заключается в том, как рассчитать высоту для img, чтобы сохранить соотношение фотографий 4: 3! Но сейчас почти 4 утра, так что придется подождать до утра.


person Ila    schedule 01.09.2011    source источник
comment
не могли бы вы опубликовать задачу на вычитание, как она появляется в вашем коде, чтобы мы могли ее увидеть?   -  person Elf Sternberg    schedule 02.09.2011


Ответы (1)


Для форматирования, несколько вещей. jQuery может принимать объекты для CSS, поэтому передавайте все за один раз. Во-вторых, только если ключ не является действительным идентификатором javascript (см. «padding-left»), вам нужны кавычки вокруг него. В-третьих, цепочка объектов jQuery, поэтому вы можете следовать за вызовом css() с вызовом removeclass() в строке. И, наконец, отступы — это действительно ваш друг.

И, наконец, функции height и width возвращают чистые целые числа, а функция css() требует включения единиц измерения. Самая основная единица измерения, возвращаемая функциями height и width, — это пиксели:

$(document).ready(function() {
    var height = $(window).height(), width = $(window).width();
    $('#menu').css({height: height + 'px', width: (height * 0.29) + 'px', position: 'fixed'})
        .removeClass('nojavascript');
    $('#novel').css({'padding-left': (height * 0.32) + 'px'})
        .removeClass('nojavascript');
    $('#photo').css({width: width + 'px'});
 });
person Elf Sternberg    schedule 01.09.2011
comment
Это был и мой ответ, но я только что проверил его на SO (jQuery 1.5.2), и похоже, что jQuery достаточно умен, чтобы а) преобразовать голые числа в num + 'px' и б) Math.floor() с плавающей запятой. Но такое поведение может зависеть от браузера. - person nrabinowitz; 02.09.2011
comment
Будет ли это специфично для браузера, если блок, который я разместил в своем посте, отлично работает, чтобы назначать ширину и высоту там, где они должны быть, с назначенными пикселями? Например, #menu получает style=height: 583px; ширина: 169,07 пикселей; положение: фиксированное; даже если я не + 'px' в коде. - person Ila; 02.09.2011
comment
И спасибо за советы по форматированию, очень полезно видеть их в сравнении с реальным кодом, который я использую, а не абстрактно. - person Ila; 02.09.2011
comment
...but the css() function requires that you include units. Это просто неправда. Хотя вы должны указать единицу измерения в своем CSS, jQuery достаточно умен, чтобы добавить ее за вас... - person Joseph Silber; 02.09.2011