In visualforce pages it is very easy to create a pop up window using apex,here is some piece of that may help you tto create a pop up window in visualforce :
Command Button to open popup:
<apex:commandButton value="Add Media" action="{!createContent}" rerender="popup"/>
Here is the popup that will be open after clicking the button -
<apex:outputPanel id="popup">
<apex:outputPanel styleClass="customPopup" layout="block" rendered=" {!displayPopUp}"id="firstpopup">
<apex:pageBlock title="Add Media Files">
<apex:pageBlockButtons>
<apex:commandButton value="Show in Content Library"action="{!chatterPost}"/>
</apex:pageBlockButtons>
<iframe src='https://api.cincopa.com/v2/upload.iframe?api_token={!ApiKey}&rrid=sf:{!sObjName}:{!productID}'style='height: 390px;width:100%;' id='frame'allowfullscreen='allowfullscreen'>
</iframe>
</apex:pageBlock>
<apex:commandLink value="X" action="{!closePopup}" styleClass="close" rerender="popup"/>
</apex:outputPanel>
</apex:outputPanel>
Some css for better UI -
<style type='text/css'>
.customPopup{
background-color: lightgrey;
border-style: solid;
border-radius: 10px;
border-width: 1px;
left: 55%;
position: fixed;
padding: 5px;
box-shadow: 0px 3px 7px rgba(1, 1, 1, 5);
background: #fff;
width: 600px;
margin-left: -200px;
top: 10px;
max-width: 700px;
}
.customPopup .close{
position: absolute;
top: 10px;
right: 10px;
transition: all 200ms;
font-size: 20px;
text-decoration: none;
color: #333;
}
.customPopup .close:hover{
color: red;
}
</style>
I hope it will help you.
Regards,
Ajay