thanks
- Moved by Hemendra AgrawalMVP, Moderator Friday, April 19, 2013 5:10 AM SP 2007
Technology Tips and News
Hi Alexxuzd,
In MOSS you can leverage the core.js function, commonShowModalDialog. To use it, open your SharePoint site, and add a Content Editor Web Part with this code:
<a href="javascript:openInModalDialog()">CLICK HERE</a> <script type="text/javascript"> function openInModalDialog() { var url = "/Lists/Calendar/Calendar.aspx"; commonShowModalDialog(url,"resizable: no; status:no; scroll: no; help: no; center: yes; dialogwidth:800px; dialogHeight:500px;",RetrieveItemValue); } </script>
Hi,
In SP 2010, Select Contents in CEWP, Format--> Html Source in the ribbon,Hi,
Copy paste below code in your CEWP and see the magic:
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jQuery Popup Dialog - Click</title> <style type="text/css"> #overlay { ; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; filter:alpha(opacity=70); -moz-opacity:0.7; -khtml-opacity: 0.7; opacity: 0.7; z-index: 100; display: none; } .content a{ text-decoration: none; } .popup{ width: 100%; margin: 0 auto; display: none; ; z-index: 101; } .content{ min-width: 600px; width: 600px; min-height: 150px; margin: 100px auto; background: #f3f3f3; ; z-index: 103; padding: 10px; border-radius: 5px; box-shadow: 0 2px 5px #000; } .content p{ clear: both; color: #555555; text-align: justify; } .content p a{ color: #d91900; font-weight: bold; } .content .x{ float: right; height: 35px; left: 22px; ; top: -25px; width: 34px; } .content .x:hover{ cursor: pointer; } </style> <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script> <script type='text/javascript'> $(function(){ var overlay = $('<div id="overlay"></div>'); $('.close').click(function(){ $('.popup').hide(); overlay.appendTo(document.body).remove(); return false; }); $('.x').click(function(){ $('.popup').hide(); overlay.appendTo(document.body).remove(); return false; }); $('.click').click(function(){ overlay.show(); overlay.appendTo(document.body); $('.popup').show(); return false; }); }); </script> </head> <body> <div class='popup'> <div class='content'> <img src='http://www.developertips.net/demos/popup-dialog/img/x.png' alt='quit' class='x' id='x' /> <p> Here is the popup you wanted !!!! <br/> <br/> <a href='' class='close'>Close</a> </p> </div> </div> <div id='container'> <a href='' class='click'><h2><b>Click Here to See Popup! </b></h2></a> <br/> </div> </body> </html>
Hope this helps:
Regards
Ankur
Hi Alexxuzd,
In MOSS you can leverage the core.js function, commonShowModalDialog. To use it, open your SharePoint site, and add a Content Editor Web Part with this code:<a href="javascript:openInModalDialog()">CLICK HERE</a> <script type="text/javascript"> function openInModalDialog() { var url = "/Lists/Calendar/Calendar.aspx"; commonShowModalDialog(url,"resizable: no; status:no; scroll: no; help: no; center: yes; dialogwidth:800px; dialogHeight:500px;",RetrieveItemValue); } </script>
Hi Alexxuzd,
below is the code
<script type="text/javascript">