Load new URL in same tab after buttn click - tabs

I want to have a button on a page that links to a .pdf in a new tab (easy enough) but I also want that button to trigger the loading of a new url in the original tab. (So when the user closes the tab with the .pdf they see a new page has loaded in the original tab underneath.) Possible?

<a href="https://w3schools.com/" onclick="openNewTab()">
<button type="button">Click me btn</button>
</a>
<script>
function openNewTab() {
window.open('https://google.com', '_blank').focus();
}
</script>

Related

How to open new tab with Button click in Safari with extension?

I am having issues opening a new tab in Safari browser with my extension.
Using the Extension Builder I added bar.html:
<html>
<body>
<form id="myForm">
<input type="button" value="Button1" onclick="window.open('http://www.google.com')"/>
<button onclick='window.open("https://www.google.com", "_blank");'>Button2</button>
</form>
</body>
</html>
Neither of Button1 nor Button2 will open 'google.com' in a new tab, nor window. If I put them in a form as above, and click on Button2 it will open my bar.html in the current tab, and from there if I click either Button1 or Button2 it will open 'google.com' in my current tab.
Have you tried to use target_blank?
https://www.w3schools.com/tags/att_a_target.asp
I found this in Apple Dev library and it states "The standard window.open() method cannot be used to open a new tab and window from an extension bar. Instead, extension bars have access to the SafariApplication, SafariBrowserWindow, and SafariBrowserTab classes, which allow you to open, close, activate, and manipulate windows and tabs."
So by using a function with safari.self.browserWindow.openTab I was able to open my link in a new tab.
<!DOCTYPE HTML>
<html>
<head>
<title>Safari Developer Reference</title>
<button onclick="openInTab('http://www.google.com');">Click me</button>
<script type="text/javascript">
function openInTab(source){
var newTab=safari.self.browserWindow.openTab();
newTab.url=source;
}
</script>
</head>
<body style="color:#C02020;background:#C0C0C0;">
Google
</body>

How to create a React.js new window popup

I want my cookies details to open in a new window popup in my Chrome browser when i click on it.
This is my code-
</div>
<a href="javascript:window.open('','_self').close();">
<label className="return"><T.span text='Cookies.Homepage' /></label>
</a>
</div>
<Link to="/Cookies" target="_blank">
<T.span text='Footer.Cookies'/>
</Link>
But this always opens the cookies content in a new tab. How can i open it in a separate new window popup??
To open the new window in an actual window, and not a tab, you need to pass in a specs parameter to window.open:
javascript:window.open('','_blank','height=600,width=400');
Use blank instead of self
<a href="javascript:window.open('','_blank').close();">

Redirecting to new tab or window from current page

I am working on localhost:
I have kept
`<a href="www.facebook.com" target="_tab">
<div> </div>
</a>`
On button click it should redirect and open in new tab. But it shows following url in next tab
http://dev01.dev/Umesh/www.facebook.com
ie. localhost/current<dir>/url
rather
url
Your target is wrong, it should be
target="_blank"
change www.facebook.com to http://facebook.com. Also there is no such thing as _tab what you want is _blank.

How to create an HTML button that acts like a link to an item on the same page?

I would like to create an HTML button that acts like a link to an item on the same page. So, when you click the button, it redirects to item on the same page.
How can I do this? (I would limit the solution to HTML, CSS, and JavaScript, because currently I am not using any other language)
Current Button (Bootstrap):
<a class="btn btn-large btn-primary" href="">Democracy</a>
Try:
<button onclick="window.location.href='location'">Button Name</button
This is assuming that you are not talking about scrolling down to a regular anchor, and instead you want to scroll to actual HTML elements on the page.
I'm not sure if jQuery counts for you, but if you're using Bootstrap, I imagine it does. If so, you can bind to the "click" event for your button and put some javascript code there to handle the scrolling. Typically you might associate the link/button with the element you want to scroll to using a "data" attribute (e.g. data-scroll="my-element-id").
Without jQuery, you'll have to make a function that contains the code as described, and put in an onclick attribute that references your function, and passes "this" as a parameter to your function, so you can get the reference to the link/button element that called it.
For the code to use to actually scroll to the corresponding element, check out this article:
How to go to a specific element on page?
Quick example without jQuery:
<a class="scrollbutton" data-scroll="#somethingonpage"
onchange="scrollto(this);">something on page</a>
<div id="somethingonpage">scrolls to here when you click on the link above</a>
<script type="text/javascript">
function scrollto(element) {
// get the element on the page related to the button
var scrollToId = element.getAttribute("data-scroll");
var scrollToElement = document.getElementById(scrollToId);
// make the page scroll down to where you want
// ...
}
</script>
With jQuery:
<a class="scrollbutton" data-scroll="#somethingonpage">something on page</a>
<div id="somethingonpage">scrolls to here when you click on the link above</a>
<script type="text/javascript">
$(".scrollbutton").click(function () {
// get the element on the page related to the button
var scrollToId = $(this).data("scroll");
var scrollToElement = document.getElementById(scrollToId);
// make the page scroll down to where you want
// ...
});
</script>
Note: If you literally want a "button" rather than a "link", you can really use any element and make that clickable, e.g.:
<button class="scrollbutton" data-scroll="#somethingonpage">something on page</button>
hey try this : -
<button>Click Me</button>
then to which ever place you want to go in your site : -
u may just place the line below wherever you want,
<a name="A"></a>
hope it works for you
Bookmark your item on the same page that you want to redirect to by assigning it an id. Assume id="itemId", then use<a class="btn btn-large btn-primary" href="#itemId">Democracy</a>. When you click the button, you will be redirected to the part of the page containing that item.
Read More
<section id="sectionA">
<p>You will be directed to this section. You can use id inside div/section/p tags etc</p>
</section>
which section or div using same id in <a href="?">
Democracy
div or section eg:
<section id="democracy">
your content
</section>
try this method abosolutly work
This is the easy way to do it
<button type="button""> Click </button>
try this following code :
<button>Click Over Here</button>
then to which ever place you want to go in your site u may just place the line below wherever you want :
<a name="Link"></a>

Moving to a tab and a specific location within that tab

I have a page with a link on, and three tabs. Default view is Tab 1
The tabs are below the page fold
The end result should be that, when the person clicks on the link, it should open Tab3 and move the page up so that the user can view the content of the tab.
As it stands now, the user clicks on the link and it opens the tab3, but because the tabs are below the page fold, it seems like nothing is happening.
I want the screen to move down to the tab as well. Im currently using onClick="parent.location='#contact'" to open the tab
This is the code for the link
<form>
<input class="listbutton" type="button" onClick="parent.location='{site_url}
{url_title text="`$action_object->m_listing_info->title`"}/
{route_suffix for="listings"}{$action_object->m_listing_info->listing_id}#contact'"
value="{translate text='contact_owner'}" title="{translate
text='listestablishmentforfree'}">
</form>
This is the code where it's linking to
<li>
<span>{translate text='contact_owner'}</span>
</li>
As you did not have code, so what i can understand i am helping u
$('#anchorID').click(function() {
$("#contacts").focus();
});