JQuery 1 строка, как добавить дополнительное значение к ширине для анимации

Question

var gunboxwidth = ($('h2 span').widest().width() + "px" + 30 + "px") 

.widest () захватывает широкий диапазон внутри h2, у меня проблема в том, что он работает нормально, когда у меня НЕ

+ 30 + 'px'

это почему?мой синтаксис неправильный?

Answer 1

Попробуйте:

var gunboxwidth = ($('h2 span').widest().width() + 30 + "px");

Это добавляет 30 к числовому значению, возвращенному функцией width, затем преобразует его в строку и добавляет суффикс 'px'.

Например, если ширина диапазона равна '20', функция JQuery width вернет число 20, а не строку, подобную '20px'. Таким образом, приведенный выше код добавляет 30 к этому и приводит к строке «50px». То, что у вас есть, приведет к строковому значению:

'20px30px'

... поскольку, когда вы добавляете строки вместе, вторая просто добавляется к первой.

20 + 'px' = '20px'
'20px' + 30 = '20px30'
'20px30' + 'px' = '20px30px'

---

Вы, вероятно, лучше использовать:

var gunboxwidth = ($('h2 span').widest().width() + 30);

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

$('.selector').width(gunboxwidth);