Welcome Here And Thanks For Visiting. Like Us On Facebook...

EXEIdeas – Let's Your Mind Rock » HTML-CSS-PHP-JavaScript / JavaScript Codes » How To Open A DIV Content/Data Into A POPUP Window?

How To Open A DIV Content/Data Into A POPUP Window?

How To Open A DIV Content/Data Into A POPUP Window?

ToDay The Question Is “How To Open A DIV Content Or Data Into A New Browser POPUP Window With Close And Print Option To Make It Easy For Your Visitors With JavaScript Code”.
Some of my friends were asking about something like it so i am here again to fullfill there desire, This is a special and simple popup window shoer code that will get your DIV data and automatically creat a popup at that time and make it visible to the viewer, This is also used for removing formats like if you have style up you DIV with extra css and you allow visitor to copy the code from that DIV, When the user copy your code or data, There will automatically CSS will be copied on his clipbord, But through this all formats will be removed and only simple text with better vision will be displayed in new popup window that will make your user also happ to be easy.

There is a other BIG use of this and that is for bloggers and webmaster to sercure it’s comtent on there blog or website, If you want to make your blog secure, you will have listen about to Disable Right Click that you user can copy your data, But right click is important for better SEO that we discuss later, So ther other procedure is to Stop Highlighting Your Data from which your user will be disable to copy your data, But for bloggers and code provider sand also for those who want to secure there data but also have some data which they want to allow copy to user, So it will be difficult to stop copying limited text and allow copying that other limited text, So for those just Stop Highliting There WebPage and add your allowed copied data into the below shared DIV code from this they are enable to copy your allows data and also enable to print it directly using just a button on the new popup.
So without any more disscussion just watch the live demo and add this into your site/blog now…

Recommended For You:
Simple JavaScript Multi Tabbed Widget For Your Web Page


1.) 1.7 KB JS File Hosted On Google Code To Be Active 24/7/365 With Better Performance.
2.) Just HTML, CSS, JavaScript Code To Make It Run.
3.) Open Your DIV Data In A New POPUP Window By A HTML 3D Button Only.
4.) Simple And Easy To Add.
5.) Can Help You To Secure Your Content.
6.) Best For Bloggers.
7.) Close The POPUP And Print The Data Of POPUP Function Is Also Available.
8.) You Can Add Unlimited DIVs On A Single PAge Also.
9.) Simple POPUP To Be Load Quickly.
10.) You Can Customized Your Main DIV With Extra CSS Also.

How To Add In Blogspot?

1.) Go To Your
2.) Open Your Desire Blog.
3.) Go To “Layout“.
4.) Click “Add A Gadget” Where You Want To Add It.
5.) Now Scroll To “HTML-JAVASCRIPT
6.) Click “+” Icon To Add It.
7.) Now Copy The Below Code And Paste It To There.

<script type="text/javascript" src="">

8.) Leave The Title Empty.
9.) Click Save, Now You Are Done.
10.) Now In Your Post/Page, Just Add The Below Code As Mucu As You Want.

Recommended For You:
Drag And Drop Reorder List & DIV Using Pure JavaScript

How To Add In Website?

1.) Just Go To Your HTML File.
2.) Now Copy The Below Code And Paste It Between “<head> </head>”.

<script type="text/javascript" src=""></script>

3.) Now Copy The Below Code And Paste It Between <body> </body>.
4.) Save It, Now You Are Done.

<div style="width:500px; border:1px solid black;"  id="bodyText1" >
Your Text, Encoded HTML Code, Frame, Video, Images Or AnyThing Here That You Want To Open In New POPUP Window...
<br />
<input type="submit" title="Show Code In A POPUP Window." onclick="codeInPopup('bodyText1');" value="Copy The Code" />


1.) Change The Blue Text With Your Main DIV CSS As You Want.
2.) Change Red Text With Your Desired Text, Encoded HTML Code, Frame, Video, Images Or AnyThing Here That You Want To Open In New POPUP Window…
3.) Change The Italic Text With Your ID Name And Alway Make It Same With The Button ID Name.
4.) Change The Bold Text With Your Desired Data.
5.) If You Want To Add A New DIV On The Same Page, Just Change The ID Name But Make Both Same In New DIV.

You Like It, Please Share This Recipe With Your Friends Using...

Be the first to write a comment.

Leave a Reply

Your email address will not be published. Required fields are marked *