Could someone please share how to create a link and not letting the users know the url of the link?
For example in the following website, when you hover over the practice groups the mouse shows that its a hyperlink but the url doesn't get dsplayed.
verbling.com/community
I am developing a similar page. Kindly share how to create a link and not letting the users know the url of the link.
Following this simple example with jquery
Click Here
$(function(){
$('.do_action').click(function(e) {
e.preventDefault();
// Open link on same page
document.location.href = 'http://example.com';
// Open link in tab or other window
// window.open();
});
});
For new tab window.open()
you can add a click function and set the location throgh javascript like:-
$( document ).ready(function() {
$( "#target" ).click(function() {
location.href = 'http://address.com';
});
});
for this thing to work you have to include jquery, either from your server or from CDN like
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
Related
I wanted to make the tag open two URLs at the same time. This is what I tried:
Only HTML
text
This did work but not the way I wanted it to. It would open the URL2 when clicked on it and if opened in a new tab with right click or the mouse wheel it would open URL1. I want it to open both pages in new tabs at the same time.
HTML + JavaScript
HTML:
<a id="myId">text</a>
JS:
myId.onclick = function(){
open('https://www.example1.com');
location.href = ('https://www.example2.com');
}
This didn't work at all.
This is Your code :
myId.onclick = function(){
open('https://www.example1.com');
location.href = ('https://www.example2.com',,'_blank');
}
Change the code to:
myId.onclick = function(){
window.open('https://www.example1.com','_blank'); //just use window.open() for both the cases;
window.open('https://www.example2.com','_blank');
}
Hope, you have got the solution for your problem.
As per your requirement, I would suggest following.
Also look at the fiddle HERE
Open Two URLs
var myId = document.getElementById("myId");
myId.onclick=function(){
window.open("https://www.google.com","_blank");
window.open("https://www.microsoft.com","_blank");
}
You should be allowing your browser's POPUP BLOCKER to allow opening multiple pages/tabs for this to work.
Try using an onclick function that uses window.open to open the two URLs:
document.querySelector("#foo").onclick = function () {
window.open("https://www.example.com", "_blank");
window.open("https://www.example.com", "_blank");
};
<a id="foo">bar</a>
I'm wanting to link to a certain tab (Portfolio Tab) on a page from the main menu of a website, so when clicked it goes to that page with that portfolio tab open.
So far I've come up with this (using jQuery Tabslet) which works when not on the same page, but doesn't work if the user happens to be on the same page as the tabs, and so does nothing.
The link I use in the main menu is /about/#tab-3 which is doing the job of going to the about page with the portfolio tab open.
I thought I may need to trigger a page refresh when on the same page? And perhaps remove the #tab-3 from the url too.
Not being a jQuery expert, I unfortunately just don't know.
Here is the code so far
Thanks in advance.
jQuery(document).ready(function($){
$('.tabs').tabslet({
active :1,
animation : true,
container: '.tabs-container'
});
var hash = $.trim( window.location.hash );
var anchor = $('a[href$="'+hash+'"]');
if (anchor.length > 0){
anchor.click();
}
window.onload = function () {
if (location.hash) {
window.scrollTo(0, 0);
}
};
});
Advise: Always mention a reference to the plugin you use. I assume here you talk about this one.
This plugin acts on tab click only.
So when using a window hash in a link from another page like you do, you have to "simulate" a click on the tab.
So you will use an attribute selector to find the anchor having a href corresponding to the hash...
And click it.
window.onload = function () {
if (location.hash) {
window.scrollTo(0, 0);
$("a[href='"+location.hash+"']").click(); // Add this!
}
};
If we have some pictures shown on the page as thumbnails, and when the user click on the picture , the page show the full picture using any JavaScript or JQuery methods.
how we can change the browser url address to point to picture instead of the main page website while keeping the user on the current page.
for example:
if we visit any instagram account for example
http://instagram.com/fofo
and when we click on any photo the script will change the address url in the browser to
http://instagram.com/p/ReTycBy2Bj/
for example
how we can do something that?
Thanks for help
You can achieve that by manipulating the browser history using the history.pushState() method on supported browsers. See https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history#Adding_and_modifying_history_entries for details.
Here is an example of a script that will solve my question
After review +lshearer answer and start searching about "pushState" and while im searching I found this url http://html5.gingerhost.com/seattle which helps me to understand how to change the URL of browser address bar without loading it's content.
<html>
<head>
<title>some title</title>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
</head>
<script>
$( document ).ready(function() {
// Handler for .ready() called.
var original_url = window.location.pathname;
$("#show").click(function() {
href = "picurlhere.jpg";
// HISTORY.PUSHSTATE
history.pushState('sss', 'New URL: '+href, href);
});
$("#close").click(function() {
// HISTORY.PUSHSTATE
history.pushState('sss', 'New URL: '+original_url, original_url);
});
});
</script>
<body>
<button id="show">showpic</button>
<button id="close">closepic</button>
<pre></pre>
</body>
</html>
I tested it on FireFox 25+, Chrome 31+
And it works.
When I click on 'showpic' button the script will change the url to 'picurlhere.jpg' and when I click back to 'closepic' button it will return me the original page URL.
This will help us while showing images using JQuery or JavaScript methods so we can change the browser url because if the user copy the link and send it to any one it will point him to the picture url not to the site page. and that is exactly used on instgram.
but in real show you have to make this script more smarter.
Thanks for Help.
No need to use any script, just plain HTML. Wrap your image like this:
<img src="your-image.jpg" alt="">
In my Billing CMS (WHMCS) there's a page that redirects you to another page.
The problem is that this redirected page is being opened as a Pop Up, and I'm looking for the source of it to make it open in target="blank" instead.
This is the redirect script I found in the page that originates the pop up:
<script language="javascript">
setTimeout ( "autoForward()" , 0 );
function autoForward() {
var submitForm = $("#submitfrm").find("form");
submitForm.submit();
}
</script>
Can this function trigger the Pop Up? Is there a way to change it to _blank by adding something to the code above? If not, what should I look for to find the source of this function?
Thanks!!
If you have control over that function, set the form's target
function autoForward() {
var submitForm = $("#submitfrm").find("form");
submitForm.prop('target', '_blank');
submitForm.submit();
}
Here is the documentation on target.
I want to set up the site so when users click on RSS feed links (which I display in part of the site), the feed link appears in a pop under. It makes sense on the site. It's something my users want.
What I can't figure out is how to populate the rss links that I'm pulling to get them to open in a pop under.
I've got this:
$(document).ready(function(){
$("a[href^='http']").attr('target','_blank');
});
which does open the link in a new window. I can add another line like this:
$("a[href^='http']").attr('onClick','openpopup()');
but I'm not sure how to craft some javascript that will 1) grab the href from the anchor; 2) replace it with a javascript(void); 3) use that url in something like this:
function openpopup() {
window.open("url","","toolbar=no,menubar=no,location=no,scrollbars=no,resizable=no,status=no,width=1250,height=500,left=250,top=175").blur(); window.focus();}
Any ideas?
Not much of a jQuery guy, but this should work
$("a[href^='http']").click(function(event) {
event.preventDefault(); // prevent the link from opening directly
// open a pop for the link's url
var popup = window.open( this.href , "", "toolbar=no,menubar=no,location=no,scrollbars=no,resizable=no,status=no,width=1250,height=500,left=250,top=175" );
popup.blur();
window.focus();
});