i have elements like this on page
go to hi
.
.
<a name="hi">hi text here</a>
but i would like users go to "hi text here" at first on page loading. how to do this?
I'd suggest that you first test for another hash before moving your users' browser to focus another element:
if (!document.location.hash){
document.location.hash = 'hi';
}
JS Fiddle demo.
Incidentally, you can use the hash (the part after the # in the URL) to jump to any element that has an id, you don't need to use the named-anchors (<a name="hi">...</a>).
Either, you can use the URL with the anchor (mysite.com/#hi) or you could use javascript:
document.getElementById('hi').scrollIntoView(true);
Please note that you should use ID, not name.
i think it would be usefull to work with anchors:
<a name="hi">here goes the text information what you like</a>
Create a link to the "hi Section" inside the same document:
Go to hi
Or, create a link to the "hi Section" from another page:
<a href="http://www.stackoverflow.com/html_links.htm#hi">
Visit the hi Section</a>
You can use jQuery along with its scrollTo plugin, and then write something like this:
$.scrollTo("a[name = hi]");
It should work just fine.
Related
I have a ticket system, where I want to make user email clickable. (It's just text atm.) HTML of the div looks like:
<a class="hover-contact-box lowercase">f11111#gmail.com</a>
I've installed the extension 'Custom JS' for Chrome. Is it possible to write JS code that will allow me to convert this text into a link, that will lead me to backoffice, and put this mail into search box? Thanks.
EDIT: Editing the HTML is not an option. I was wondering if there's a possibility to make the email itself clickable.
EDIT: I do not need a mailto:, i need redirection to external source.
With jquery you could do something like
var email = $('a.hover-contact-box.lowercase');
email.attr('href', 'mailto:' + email.text());
If you want to make this email clickable use href Attribute
email text
in javascript you can use
document.getElementsByClassName("hover-contact-box lowercase")[0].setAttribute("href", "mailto:yourmail");
I hope it helps
If you can't use jquery:
Considering you have only 1 element with given Classname:
document.getElementsByClassname("hover-contact-box lowercase")[0].setAttribute('href', 'mailto:yourmailid#gmail.com?subject=Hello Everyone&body=Just want to say hello to you all!!');
If there are multiple elements having same classnames:
You have to iterate in the list returned by getElementsByClassname and do setAttribute('href', ....)
If you can use Jquery:
var elem = $('a.hover-contact-box.lowercase');
elem.attr('href', 'mailto:yourmailid#gmail.com?subject=Hello Everyone&body=Just want to say hello to you all!!');
Both example will make it a link such that:
mail to: yourmailid#gmail.com
Subject: Hello Everyone
Content: Just want to say hello to you all!!
If you have full control on html page for editing:
<a href='mailto:yourmailid#gmail.com?subject=Hello Everyone&body=Just want to say hello to you all!!' > yourmailid#gmail.com </a>
I use Wordpress and I would like to have a plugin that allow me to open a box/popup content for "a href" call.
Something like this:
Text use it in a div tag
this is the code i use:
<div class="tracklist download-button2" style="display: initial-block">
<a href="#">
<span class="header-clip2">
<span class="header-triangle2"></span>
</span>
<span class="header-bg2"></span>
<div class="clear"></div>
<div class="file-icon-inner2">
<i class="icon-download2"></i>Tracklist
</div>
</div>
please check http://af-sound.ro "Tracklist" button
so whoever will click on Tracklist, i would like to have a box popup opened with the content inside.
There will be more "tracklist" buttons, so i dont need just a global popup box. I have tried with Anything popup but that doesn't work as it use a shortcode like: [anythingpupup=id1] which cannot be used in "a href" call
The first issue here is that you are missing the closing anchor tag
Secondly, you should give the box which you'd like to open an "id" attribute.
<div id="popup-box"></div>
Wherever you place your anchor tag, you can then reference the box using
Click to open popup
The "#" will refer to the id attribute of the matched element.
There is no need to install an entire Wordpress plugin. You can use something like Bootstrap Modals
The instructions are very straight forward to help you set it up.
I think you don't need a plugin for that. You could use just javascript to open such popup from an anchor. Here is an example code:
Open Popup!
<script language="javascript">
function Popup()
{
var win = window.open('', '',"toolbar=no, width=100, height=20");
var doc = win.document.open();
doc.write('<html><body> <b>Hello!</b> </body></html>');
doc.close();
}
</script>
As you can see, you can add any dynamic html as content of the popup, including the html that you want in the doc.write method.
Cheers!
There are a number of ways of achieving this, depending on the result you want to get.
Maybe the simplest way is not using a plugin at all; just add a hidden div with the content of the popup in it. And then, from jQuery, capture the click of your tag a and show up that hidden div. From CSS you can style that div in any way you need.
If you want to use a plugin, you could use Fancybox or any other similar, given the fact that you already have jQuery on your website.
When I click on a link (or hover with a mouse), the URL shows up at the bottom of the screen. That's the default behaviour in Firefox.
How can I prevent this ?
I'm making a website for tactile interfaces.
Thanks !
It would be better if you are using any other tag other than <a> if suppose you are using a
<div id='idofdiv'> tag
the query will be
$('#idofdiv').click(function(){
window.open('www.google.com');
});
hope this helps!!
Browsers don`t show what object will do onClick, so try this:
<div onclick="location.href ='http://www.google.com';"> click me </div>
Or you can use span which is inline element:
<span onclick="location.href ='http://www.google.com';"> click me </span>
you can achieve this using jquery,
first inlcude the jquery library in your page then
write the script in the page
$(function(){
$('[data-url]') //select all elements having data-url
.click(function(e){ e.preventDefault();
window.location.href= $(this).attr('data-url')})
})
and in the html
<span data-url="#/inbox" >Go to inbox</span>
<a data-url="mydraft.html">Drafts</a>
This is not possible and CSS is nowhere here, you just cannot do it with CSS, well you can use something like this to spoof the <a> link but I suggest you don't use all this, without any specific reason, anyways they'll find the URL from the source page
Spoofing
Demo
Note: Actually just checked, the demo is not working on the fiddle page but just make a local .html page and it will work
Is there a standard way for making all the links in a site, with the form href=#something, become 'go-to' links? (does this kind of links have a name?)
Let me describe these links further: When you click them, #something is added to the url. And if you go directly to that url from your browser, it takes you to that page, and then it scrolls down to that link.
Take this link as example: http://en.wikipedia.org/wiki/Universe#cite_note-Craig-45
Edit: As you can see, the div gets highlighted. How to make that happen automatically?
You're referring to anchor tags. Here's an example of a JavaScript-less internal link:
Go to my div!
<div id="myDiv">
This is content
</div>
If you want to send someone to myDiv using JavaScript, then you could do it this way:
<span onclick="window.location.hash = '#myDiv'">Go to my div!</span>
<div id="myDiv">
This is content
</div>
Here's a jsFiddle that demonstrates both the HTML and JavaScript methods.
You can also use a similar method to allow the use to navigate to page and then scroll them to the appropriate element on the page. Simply add the hash (#) plus the ID of the element to the URL. For example:
Go to my page and then div!
Or, with JavaScript
Go to my page and then div!
Use the id attribute of the a tag. Place the following at the location you would like to link to:
<a id="example"></a>
You can then link to that using:
Go to example
If you want to link to a specific anchor on a different page, simply use the # character after the URL:
Go to different page example
Here's an example.
The thing after the # is called an anchor, and is defined using the a-tag: <a id="something">.
If you just have #something as a link, like <a href="#something">, it will resolve relatively to the current page. So if your page is at http://myurl/mypage.html then it will open http://myurl/mypage.html#something.
I am trying to change a link programmatically.
Example:
I want to call a dialog and change an image buttons url link based upon the call it gets.
so:
<a href="javascript:myHref('http://www.google.com')" onclick="$('.hiddendiv').dialog('open');" > Edit Address </a>
the function myHref would change a link within the div (let's call it myAnchor) to http://www.google.com.
Thoughts on how to go about this?
I've seen methods for changing a designated link, but not in this manner.
I think this code might be what you are looking for:
var linkattributes=document.getElementById("link-id").attributes;
linkattributes.getNamedItem("href").value = 'http://www.google.com';