How to open a html hyperlink in a modal box or pop up window on the same page ? Have you a question something like this ? Don't worry i am here to solve your problem, Follow the given steps below sequentially to solve your problem.
So Lets Start
Before go ahead i just want to tell you one thing , To solve this problem you must have some basic knowledge of few JavaScript Events, You can solve this problem by using some JavaScript Events, So Lets Begin...
First of all you have to create two html pages, The first page for link or button that holds the link of second html page, and the second page for pop up window or modal box that you want to open in a modal box or pop up window by clicking a html link or button that appear on the first html page,
Here is the code that you have to add in your first html page...
Like This <a href="link.html"> Click on this Link to open a Second html Page... </a>
You can also customize the size of pop up window, you can change the height and width of pop up window by using a height and width tag.
Like This
In above example as you can see the width = 1350 and height = 600 , You can change the both property according to your requirements, If you need minimum width and height you can customize it like this width = 1000 and height = 400 .
At last Thanks for Reading...
If you have any question or doubt related to this post Don't forget to leave your comment in comment Box.
How to's
,
HTML
,
JavaScript
,
Web Development
So Lets Start
Before go ahead i just want to tell you one thing , To solve this problem you must have some basic knowledge of few JavaScript Events, You can solve this problem by using some JavaScript Events, So Lets Begin...
First of all you have to create two html pages, The first page for link or button that holds the link of second html page, and the second page for pop up window or modal box that you want to open in a modal box or pop up window by clicking a html link or button that appear on the first html page,
HTML Code :
<a href="SecondPage.html" target="popup" onclick="window.open('SecondPage.html','popup'); return false;" >
// This button for open a second html page in a pop up window.
<button>Open a Second html page by Clicking on this Button...</button>
// This button for open a second html page in a pop up window.
<button>Open a Second html page by Clicking on this Button...</button>
You can also open a same page in a pop up window or modal box by using a link.
<a href="SecondPage.html" target="popup" onclick="window.open('SecondPage.html','popup'); return false;" >
Open a Second html page by Clicking on this Link...</a>
// This Link for open a Second html page in a pop up window.
You can also customize the size of pop up window, you can change the height and width of pop up window by using a height and width tag.
Like This
<a href="SecondPage.html" target="popup" onclick="window.open('SecondPage.html','popup','width=1350,height=600,scrollbars=no,resizable=no'); return false;" >
//This button for open a Second html page in a Pop Up Window
<button>Click this Button to open a Second html page in a Pop Up Window...</button>
//This button for open a Second html page in a Pop Up Window
<button>Click this Button to open a Second html page in a Pop Up Window...</button>
In above example as you can see the width = 1350 and height = 600 , You can change the both property according to your requirements, If you need minimum width and height you can customize it like this width = 1000 and height = 400 .
At last Thanks for Reading...
If you have any question or doubt related to this post Don't forget to leave your comment in comment Box.
good
ReplyDelete