CODEWITHSUNDEEP
javascriptjquerypopup
Alex
Alex

Reputation: 68396

JavaScript / jQuery - Open current link in pop-up window

<a href="http://google.com">Link</a>

How can I open this link in a pop-up window? And prevent the browser to block it

Upvotes: 25

Views: 90299

Answers (6)

Arunav dutta gupta
Arunav dutta gupta

Reputation: 109

Mine is working properly

        <style>
        td,
th {
    border: 2px solid rgb(190, 190, 190);
    padding: 20px;
}

td {
    text-align: center;
}

tr:nth-child(even) {
    background-color: #eee;
}

th[scope="col"] {
    background-color: #696969;
    color: #fff;
}

th[scope="row"] {
    background-color: #d7d9f2;
}

caption {
    padding: 20px;
    caption-side: bottom;
}

table {
    border-collapse: collapse;
    border: 2px solid rgb(200, 200, 200);
    letter-spacing: 2px;
    font-family: sans-serif;
    font-size: 1.5rem;
}

JS BELOW

</style>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>

Script below

<script>
$(document).ready(function(){
    $('[data-toggle="popover"]').popover();   
});
</script>

Code

echo "<td><ul class='list-inline'>";      
           echo "<li><a href=# title=Increaseby".$d."%&nbsp;".$h."%&nbsp;".$k."% data-toggle=popover data-placement=top data-content=".$p4."&nbsp;".$p6."&nbsp;".$p8.">View Increase</a></li>";
           
            echo "</ul></td>";

Try This Hopefully it will resolve your issue

Upvotes: 0

creativedirektor
creativedirektor

Reputation: 79

You can try the code below,

<script type="text/javascript">
     window.open(location.href, "Google", "width=500,height=500");
</script>

Upvotes: -1

user285594
user285594

Reputation:

jQuery:

<script>
$('#button2').live("click",function(e){    
  window.open("http://www.google.com", "yyyyy", "width=480,height=360,resizable=no,toolbar=no,menubar=no,location=no,status=no");
return false;
});
</script>

<a href="#" id="button2" ><img src="images/online.png"></a><br/>Online

Upvotes: 1

jpsimons
jpsimons

Reputation: 28090

There's "new windows" and there's "popups". Using target=_blank will open in a new window, except that modern browsers put new windows in new tabs by default. Which sounds like it isn't what you want.

For an actual popup you want window.open(), and be sure to include some specific width and height, otherwise some browsers will still put the new window in a new tab. Darin's example looks good to me.

As for popup blocking, the general approach that browsers take is that popups initiated by user action are allowed (such as clicking), while popups initiated spontaneously through script, such as this, are blocked:

<script type="text/javascript">
    window.open("http://www.google.com/", "Google", "width=500,height=500");
</script>

However, ad blocking being an escalating war, you can never be sure that a popup will open. If your popup is blocked, the window.open call returns null. So I would modify Daren's example like this:

<a href="http://www.google.com/"
    onclick="return !window.open(this.href, 'Google', 'width=500,height=500')"
    target="_blank">

If the popup is blocked, onclick returns true, which follows the link they clicked by opening it in a new window or tab. It's a fallback, so at least the content is accessible (if not pretty).

Upvotes: 71

Codler
Codler

Reputation: 11256

This will open a new window.

<a href="http://google.com" target="_blank">Link</a>

Upvotes: 2

Darin Dimitrov
Darin Dimitrov

Reputation: 1038710

<a href="http://google.com" onclick="window.open(this.href, 'windowName', 'width=1000, height=700, left=24, top=24, scrollbars, resizable'); return false;">Link</a>

Upvotes: 14

Related Questions