Установка высоты DIV в соответствии с расположением якоря внутри указанного DIV - PullRequest
6 голосов
/ 26 ноября 2011

Основная проблема : http://jsfiddle.net/pipip/P46Xg/
У меня есть div контейнер с несколькими абзацами текста,
и внутри одного из этих абзацев есть следующий якорь <a name="stop" />
Контейнер установлен на overflow:hidden

Возможно ли с помощью javascript / JQuery установить высоту контейнера так, чтобы нижняя часть контейнера останавливалась точно на или ниже якоря?

Добавлены глубина и фон : http://jsfiddle.net/pipip/yj9dB/
Это будет использоваться для модифицированного слайдера JQuery.Где кто-то, использующий CMS, может ввести [readmore] в любом месте в поле Content, которое будет заменено вышеуказанным якорем через PHP.Таким образом, они могли бы легко контролировать, где в контейнере появляется разрыв Read More.В соответствующем примере я жестко кодирую высоту до 75px, хотя я хочу, чтобы высота зависела от расположения якоря name="stop" в тексте.

Спасибо.Если это ужасный путь, я весь в ушах!

Ответы [ 2 ]

5 голосов
/ 26 ноября 2011

С помощью jQuery вы можете сделать это следующим образом:

$('#container').height( $('a[name=stop]').position()['top'] );

и CSS:

#container {
    position: relative;
}

Нам это нужно, потому что .position() дает нам позицию относительнородительский элемент смещения элемента , и мы можем сделать #container родительским элементом смещения тега привязки, установив для его position значение relative.

JSFiddle: http://jsfiddle.net/divad12/RYPm7/1/

такжедля HTML5 вы можете рассмотреть возможность установки атрибута id якорного тега вместо name: HTML-якорей с именем или идентификатором?

0 голосов
/ 26 ноября 2011

Тем не менее, лучший способ - заставить ссылку загрузить полную статью через Ajax.

...