Salesforce For YOU: Stylish PopUp Box In Visualforce Page

Tuesday 16 August 2016

Stylish PopUp Box In Visualforce Page

VisualForce Page Code :-

<apex:page sidebar="false" standardStylesheets="false" showHeader="false">
<head>
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" />
    <link rel="stylesheet" media="print" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" />
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
</head>   
<br></br><br></br><br></br><br></br><br></br>
<table align ="center" >
  <tr><td>
<!-- Button trigger modal -->
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
  PopUp Instructions
</button>
</td></tr>
   </table>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        <h4 class="modal-title" id="myModalLabel"> Instructions </h4>
      </div>
      <div class="modal-body">
      When you turn on a new iOS device or after you’ve completed the update to the latest version of iOS, follow the instructions in the setup assistant to activate your device and set up iCloud.1
      If you skipped the setup process, tap the Settings icon on the Home screen, select iCloud, then enter your Apple ID.
      Want to use a different Apple ID for iTunes?
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        
      </div>
    </div>
  </div>
</div>


</apex:page>