Вычислить ширину элемента?
Я пытаюсь получить ширину div, чтобы я мог отобразить его в php.
Может кто-нибудь дать мне указатель, как этого добиться?
По сути, я хочу разработать «отзывчивый» <div> который будет отображать ширину родителя <div> в php в адаптивном шаблоне. Очевидно, что в разных размерах окна адаптивный шаблон изменяет размер ширины, и мне просто нужно найти способ вывести эту ширину и отобразить ее в php. JQuery уже работает в фоновом режиме, так что я могу подключиться к этому …
Просто нужно немного направления
Решение
Ваш PHP-код будет работать на стороне сервера. Вы сможете определить ширину клиентской части (например, с помощью javascript) после того, как DOM будет сгенерирован. Вы можете сделать это с простым JavaScript, выполнив
document.getElementById("yourDivId").offsetWidth
или используя jQuery
$("#yourDivId").width()
Если вам действительно нужна ширина, доступная в вашем PHP-коде, вам нужно будет отправить пост-запрос (ajax или полный), чтобы PHP мог иметь значение.
Другие решения
Вы не можете сделать это, потому что PHP работает на сервере, пользователи будут посещать страницу из своего браузера, который обычно является другим компьютером. После того, как пользователь введет веб-адрес в адресную строку и нажмет Enter, на сервер запрашиваемой страницы будет отправлен запрос GET. Сервер запустит серверный скрипт (например, в PHP), сгенерирует структуру страницы и отправит эту структуру на стороне клиента, то есть в браузер. Когда сервер отправил структуру в браузер, код PHP уже был успешно завершен, но структура еще не отображалась, поэтому ваш divна этом этапе еще не существует, не говоря уже о том, чтобы width ценности.
Таким образом, поведение, которое вы намеревались достичь, невозможно с PHP, поэтому вы должны делать это по-другому. Могу ли я рекомендовать Javascript с помощью jquery? Например, если ваш внешний div имеет id="a" и внутренний div имеет id="b", то вы можете сделать следующее в Javascript:
$(function() {
$("#a").resize(function() {
$("#b").text($(this).width());
});
});
Здесь у вас есть function который будет работать при событии загрузки, а затем зарегистрирует resize событие для внешнего div, который изменит внутренний текст внутреннего div в соответствии с width внешнего div,