MDanz Posted March 2, 2010 Share Posted March 2, 2010 i won't put all the code. this is the css for layer1. Now i know how to make the layer pop-up(visible) with javascript. How do i set the position it pops up to where the mouse was clicked on the page in javascript? example.. #layer1 { position:fixed; visibility: hidden; width:600px; height:auto; background-image:url(popupbg.jpg); border: 1px solid #FBB917; padding: 10px; font-weight:200; color: #FFFFFF; } Link to comment https://forums.phpfreaks.com/topic/193902-div-position-help/ Share on other sites More sharing options...
Omirion Posted March 2, 2010 Share Posted March 2, 2010 event.clientY event.clientX These get your x bad Y coord. Then set the document.getElementById(id).style.left = xpos document.getElementById(id).style.top = ypos Sorry don't have time to write out a proper function for you, hope you can manage. When i get back home i'll write it out if you need it Link to comment https://forums.phpfreaks.com/topic/193902-div-position-help/#findComment-1020578 Share on other sites More sharing options...
MDanz Posted March 3, 2010 Author Share Posted March 3, 2010 here's what i've attempted but its not working. css #layer1 { position:fixed; display: none; width:600px; height:auto; } div <div id="layer1"></div> textarea <textarea id="reply" name="reply">testing</textarea> button to click <a onclick="setVisible;">button</a> the javascript i attempted didn't work. I'm just using the above as a basis to get my javascript code working correctly. how would i do the above to onclick of button the div displays where the mouse is clicked and it displays the textarea value? Link to comment https://forums.phpfreaks.com/topic/193902-div-position-help/#findComment-1020788 Share on other sites More sharing options...
MDanz Posted March 3, 2010 Author Share Posted March 3, 2010 not working? <head><style type="text/css"> #layer1 { position:fixed; display: none; width:600px; height:auto; } </style> </head> <body> <a onclick="setVisible();">button</a> <textarea id="reply" name="reply">testing</textarea> <div id="layer1"></div> <script type='text/javascript'> function setVisible() { var div = document.getElementById('layer1'); // put the correct content in the div here div.innerHTML = reply.value; div.style.left = window.event.clientX + 'px'; div.style.top = window.event.clientY + 'px'; div.style.display = 'visible';} </script> Link to comment https://forums.phpfreaks.com/topic/193902-div-position-help/#findComment-1020855 Share on other sites More sharing options...
MDanz Posted March 3, 2010 Author Share Posted March 3, 2010 this isn't working either.. <head><style type="text/css"> #layer1 { position:fixed; display:none; width:600px; height:auto; } </style> </head> <body> <div align="right"> <a onclick="setVisible();">button</a> </div> <textarea id="reply" name="reply">testing12345678910ffafaf</textarea> <div id="layer1"></div> <script type='text/javascript'> function setVisible() { document.getElementById('layer1').innerHTML = document.getElementById('reply').value; document.getElementById('layer1').style.left = window.event.clientX + 'px'; document.getElementById('layer1').style.top = window.event.clientY + 'px'; document.getElementById('layer1').style.display = 'visible';} </script> </body> Link to comment https://forums.phpfreaks.com/topic/193902-div-position-help/#findComment-1020863 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.