Я загрузил сборщик datetime javascript из следующего источника
http://www.rainforestnet.com/datetimepicker/download/sample.zip
Я перетащил этот файл в мою форму asp.net. теперь при нажатии на изображение календаря календарное всплывающее окно в позиции
position: absolute;
left: -1px;
top: 0px;
width: 208px;
border: 1pt solid rgb(0, 0, 0);
padding: 0px;
cursor: move;
background-color: rgb(255, 255, 255);
z-index: 100;
означает в начале страницы. Как я могу установить свою позицию, ограниченную календарным изображением, т.е. везде, где это изображение размещено, всплывающее окно появляется только на этом изображении
Если вы используете положение абсолютное вместе с верхним и левым положениями, абсолютная позиция на странице. НО, если вы используете абсолютное положение в элементе с позицией: относительное положение является абсолютным для этого элемента
Не используйте сверху и слева или попробуйте:
<div style="position:relative">
<img src="images2/cal.gif" onclick="javascript:NewCssCal('demo1')" style="cursor:pointer"/>
</div>
Я рекомендую использовать фиксированную позицию, а не абсолютную, поскольку это привяжет всплывающее окно к окну, а не к родительскому элементу. при показе всплывающего окна вы устанавливаете верхнее и левое свойства как смещение от изображения плюс то, что когда-либо компенсировалось вам для всплывающего окна.
простой jquery:
popup.offset(image.offset());
Я запускаю эту функцию (требуется jquery). он устанавливает положение позиции якоря и настраивает всплывающее окно, если элемент находится слишком близко к нижней части окна:
function showPopup() {
var offset, difference;
offset = image.offset();
popheight = popup.height();
difference = Math.min(0, $(window).height() - (popup.height() + offset.top + 15))
// the diffrence betwenn the bottom edge of the popup, and the windows lower edge (+15 to add a bit of space)
if (difference < 0) {
offset.top += difference;
}
popup.offset(offset);
screenCover.show().click(hidePopup);
}
ScreenCover в последней строке - это полноэкранный div, который я использую, чтобы поймать клики со стороны всплывающего окна (так как для всплывающего окна требуется взаимодействие с пользователем)
функция hidePopup:
function hidePopup() {
popup.hide();
screenCover.off('click').hide();
}