Создание внутреннего дива
Доброго времени суток, уважаемые форумчане!
столкнулась с такой проблемой: есть картинка. по выделению области, как только пользователь отпустит мышь(т.е. на событие onmouseup) должен создаться новый див, в котором будут данные о выделенной области. просто alert не подходит
document.onmouseup = function() {
if ( activeImage ) {
var iRect = activeImage.getBoundingClientRect();
var sRect = activeSelection.getBoundingClientRect();
var X = ( sRect.left < startX ? sRect.left : startX ) - iRect.left;
var Y = ( sRect.top < startY ? sRect.top : startY ) - iRect.top;
activeSelection.innerHTML = '<div style='color:red; background-color: blue'>text</div>';
/*alert( [
'X: ' + X,
'Y: ' + Y,
'W: ' + activeSelection.offsetWidth,
'H: ' + activeSelection.offsetHeight
].join('\n') );*/
// ------------------------------
if ( activeSelection.parentNode ) {
activeSelection.parentNode.removeChild( activeSelection );
activeSelection.style.width = '0';
activeSelection.style.height = '0';
}
activeImage = null;
}
}
|
веснушка, заранее создайте div и помещайте туда соответствующие данные...
или div должен быть поверх страницы? |
поверх страницы. заранее нельзя создать, как я поняла.
а именно при mouseup его нужно создать и поместить туда данные |
Цитата:
function showTxt(content){
newdiv = document.createElement('div');
newdiv.setAttribute('id', 'Div');
newdiv.onclick = function() { this.style.display = "none";};
with (newdiv.style) {
position="absolute";
top="140px";
left="100px";
border="1px solid black";
backgroundColor="#fff";
}
document.body.appendChild(newdiv);
newdiv.innerHTML = content;
newdiv.style.display = "";
}
|
если не затруднит, подскажите, как сделать так, чтобы этот див появлялся в том месте, где была отпущена кнопка мыши?
и такой вопросик: если при клике на этот див у меня должен выпадать список, то это делать внутри функции showText? |
Цитата:
document.onmouseup = function(e) {
if ( activeImage ) {
var iRect = activeImage.getBoundingClientRect();
var sRect = activeSelection.getBoundingClientRect();
var shift = shiftScroll();
var X = ( sRect.left + shift.X < startX ? sRect.left + shift.X : startX ) - iRect.left - shift.X;
var Y = ( sRect.top + shift.Y < startY ? sRect.top + shift.Y : startY ) - iRect.top - shift.Y;
e = fixEvent( e );
var shift = shiftScroll();
var rect = activeImage.getBoundingClientRect();
var X1 = Math.max( e.pageX > startX ? startX : e.pageX, rect.left );
var Y1 = Math.max( e.pageY > startY ? startY : e.pageY, rect.top );
var W1 = Math.min( Math.abs( Math.max( X, e.pageX ) - startX ), rect.right + shift.X - X );
var H1 = Math.min( Math.abs( Math.max( Y, e.pageY ) - startY ), rect.bottom + shift.Y - Y );
// тут что-то открываем, делаем
// ....
/*alert( [
"src: " + activeImage.src + "\n",
"X: " + X,
"Y: " + Y,
"W: " + activeSelection.offsetWidth,
"H: " + activeSelection.offsetHeight
].join("\n") );*/
showTxt([
"src: " + activeImage.src + "<br>",
"X: " + X + "<br>",
"Y: " + Y + "<br>",
"W: " + activeSelection.offsetWidth + "<br>",
"H: " + activeSelection.offsetHeight + "<br>"
], X1+W1, Y1+H1);
// ------------------------------
if ( activeSelection.parentNode ) {
activeSelection.parentNode.removeChild( activeSelection );
activeSelection.style.width = "0";
activeSelection.style.height = "0";
}
activeImage = null;
}
}
автор скрипта наверняка придумает решение получше... Цитата:
нужен select внутри div-a? нарисуйте его там чтобы div не закрывался по нажатию на нем закоментируйте следующую строку
newdiv.onclick = function() { this.style.display = "none"; }
и создайте на div-e кнопку или картинку насобытие onClick которого(-ой) повесьте закоментированную функцию |
веснушка,
смотрите решение в прошлой своей теме: http://javascript.ru/forum/dom-windo...tml#post188351 я добавил туда всплывающее окошко. |
только у вас всплывающее окно все время в середине изображения, а нужно там, где была отпущена кнопка мыши(
просто у моего изображения есть полоса прокрутки, т.к. оно большое(так нужно по условию) и получается, что окно всплывает где-то далеко и надо прокрутить бегунок, чтобы его найти |
веснушка,
смотрите теперь, туда же в ту тему. |
devote,
простите, я вас совсем уже замучила, но есть еще вопрос( если нужно на onmouseclick всплывающего окна повесить другую картинку, которая отобразиться в том же окне поверх прежней? |
| Часовой пояс GMT +3, время: 13:03. |