jQuery UI Widgets › Forums › Dialogs and Notifications › Tooltip, Notification, Popover › popover position
This topic contains 5 replies, has 2 voices, and was last updated by Todor 5 years, 10 months ago.
-
Authorpopover position Posts
-
Good night, I’m trying to press the popover button to go inside the div aligned in the top right. For this I am trying to modify the base.css file but I do not succeed.
A greeting.<!DOCTYPE html>
<html>
<head>
<title>jQuery Notification Sample</title>
<link rel=”stylesheet” href=”../../jqwidgets/styles/jqx.base.css” type=”text/css”/>
<script type=”text/javascript” src=”../../scripts/jquery-1.11.1.min.js”></script><script type=’text/javascript’ src=’../../scripts/jquery-1.11.1.min.js’></script>
<script type=’text/javascript’ src=’../../jqwidgets/jqxcore.js’></script>
<script type=’text/javascript’ src=’../../jqwidgets/jqxpopover.js’></script>
<script type=’text/javascript’ src=’../../jqwidgets/jqxbuttons.js’></script><script type=’text/javascript’>
$(document).ready(function () {
$(“#button”).jqxButton();
$(‘#jqxPopover’).jqxPopover({
width: 200,
height: 75,
showArrow: false,
showCloseButton: true,
position: ‘right’,
selector: $(“#button”),
title: ‘Title’
});});
</script>
</head><body>
<center>
<button id=”button” style=”margin-top: 30px;”>Click me</button>
</center><div id=”capa” style=”background-color:#C9F; width:100%; height: 100px”>
</div><div id=”jqxPopover”>
<center>
Popover content
</center>
</div>
</body></html>
Hello pepe,
Could you please explain your idea in more details, because right now I’m not quite sure what you want to achieve?
Best Regards,
TodorjQWidgets Team
https://www.jqwidgets.comGood morning, sorry for my English, but I have to use the translator.
What I want to do is that when I press the button, the popover will appear inside the div (capa).Hello pepe,
Please review the following example whether it fits your needs.
Let us know if you need further assistance.
Best Regards,
TodorjQWidgets Team
https://www.jqwidgets.comGood afternoon, thanks for the reply. The answer is a solution to what I ask, I even think I would improve it using offset to position the popoper.
But I have a problem if I change the resolution of the monitor the coordinates x and y will not be the same and the popoper will not be where I want, that’s why I wanted the popoper to be inside the div capa.
A greeting.Hello pepe,
The popover position is absolute to the viewport. When you resize the window popopver’s top and left positions are recalculating.
Also you could review jqxWindow instead of jqxPopover. Maybe it will fit better to your needs.
Let us know if you need further assistance.
Best Regards,
TodorjQWidgets Team
https://www.jqwidgets.com -
AuthorPosts
You must be logged in to reply to this topic.