I am using the Blogger SOHO theme for my Blog:
https://www.firozemistry.com
In the Featured Post, clicking on the Jump Link "Open" opens the page after the first line of text. How do I modify the HTML code to make the Jump Link open the page right at the top?
I have tried poking around in the HTML code of Featured Post widget, but I can't figure out how to do it.
I am a novice, and not well versed in HTML, so I would be most grateful in any help. Thanks in advance!
Regards,
Firoze
Go to Theme > Edit HTML
Click anywhere inside the code area and press CTRL + F
Search for fragment "more" and remove it
Update
Put this code before </body> tag to remove #more from link href
<script>
var link = document.querySelector('.jump-link a');
link.href = link.href.replace('#more', '');
</script>
Related
I am a little bit newbie in the web development.
I’m creating a simple web page with a Nav Tag navigation, but I’m not pretty sure which is the best way to redirect to another pages.
For example I have the menu: Home, Services, Contact and when you click in one of them you will go to a page with the properly information.
I have seen this structure:
<nav>
HTML |
CSS |
JavaScript |
jQuery
</nav>
But where do you go ? To another page or a section on the same page?
I would like see the same original page and when you click in one item of the menu only changes the bottom of the web page.
So what way do you recommend to do this ?
I hope you could help me, thank you so much.
Just add
"Any Text you want, in you case: "go to bottom""</l>
After this create class at the botton of the page with same id
<div class="bottom" id="ex1">
If you want to go to bottom by clicking to the link add javascript at the end of the .html file just before "/body" closes
<script type="text/javascript">
$(document).ready(function() {
$("a.go").click(function () {
var elementClick = $(this).attr("href");
var destination = $(elementClick).offset().top;
$('html,body').animate( { scrollTop: destination }, 700 );
return false;
});
});
</script>
If you want to redirect and go to another page, create html file in the same directory(same folder). Then add a link
"Any text you want, in your case: go to another page"
How can I create a link that doesn't show its information at the bottom left or right (this depends on the link's position) when you hovering a hyperlink?
Lets say that we have a link like this:
Users
and we want to hide its information or more precisely its hyperlink information that's displayed at the bottom left corner of the browser, like the example on the image below:
Now, I know this is possible because Stack Exchange network sites itself uses this for the "Welcome Banner" displayed on the front page for the very first time you visit each site.
If you hover any of the links:
Anybody can ask a question
Anybody can answer
The best answers are voted up and rise to the top
You'll see that no hyperlink information is displayed. Check out image below to see "Welcome Banner"
It cannot be done with pure html and css. You would have to use javascript for this. Showing the link of an anchor tag is just how most browsers work. Also the user expects to be able to see where he will be redirected.
But it can be done: you can avoid using an anchor tag. Then have another attribute hold the href - like "data-href". Then bind a click event on the a tag that redirects based on this attribute.
I would however, not do this - as I am uncertain if crawlers would see the link.
This is how it can be done, but note that snippets cannot redirect outside SO :)
var aTags = document.querySelectorAll('span[data-href]');
for(var i = 0; i < aTags.length; i++){
var aTag = aTags[i];
aTag.addEventListener('click', function(e){
var ele = e.target;
window.location.replace(ele.getAttribute('data-href'));
});
}
span[data-href]{
cursor:pointer;
}
<span data-href="http://www.google.com">test</span>
After digging even more deeper, I've found a more simpler and easier solution for it on this w3schools article and also with the help of this question in SO I could manage it to open on a new window:
<button id="anchorID" >Go to page</button>
$("#anchorID").click(function() {
window.open(
'http://www.w3schools.com',
'_blank' // <- This makes it open in a new window.
);
});
Jsfiddle live example: http://jsfiddle.net/6sLzghhm/
Remove the href="whatever" from the link and open link by calling a function. This completely removes the link preview on the bottom left of the page.
HTML-
<a (click)="openUrl('https://google.com')">
JS-
openUrl(url: string): void {
window.open(url, '_blank');
}
The stackoverflows Anybody can ask a question-Link is not a hyperlink. Its a HTML Element (in this case a li-Element):
<li id="q">Anybody can ask a question
</li>
with the CSS cursor: pointer; and a click-Eventlistener.
The easiest answer is just use-
<p onclick="window.open('Your Link')">Blah Blah Blah</p>
Easy!
You can also open more links at a time-
HTML:
<p onclick="OpenTwoLinks()">Google And StackOverFlow</p>
Javascript:
function OpenTwoLinks() {
window.open('https://google.com');
window.open('https://stackoverflow.com');
}
I wonder if someone can guide me on how to remove the url label that appears at the bottom of the page when you hover over an anchor (I wonder if it's even posible). I've googled a lot and didn't find any answers.
Suppose I have
<a href="www.somepage.com" title="The Page">Link< /a>
in the bottom of the page there will appear a tooltip/label showing "www.somepage.com".
Please see here for an example
Thanks in advance!
You can use either Javascript or JQuery.
For example, you can set to A attribute "href=#" and add an attribute url=www.somepage.com something like this:
Link
If you click over this nothing happen.
Now, you need to apply with javascript or JQuery click event. The next example is using JQuery and Javascript:
At the bottom of page's body:
<script>
$('#link').click(function() {
var url = $(this).attr('url');
window.location.href=url;
});
</script>
Haw can i share some info on facebook wall?
http://www.facebook.com/sharer.php?u=http://Mysite.com/default.aspx&t=sometext doesnt work.
I want to add custom share button on the my own website
what do you want to share exactly ??
if it's a website ,just copy the link you want to share and paste it inside the status area .
<script>
function fbs_click()
{
u=location.href;
t=document.title;
window.open(‘http://www.facebook.com/sharer.php?u=’+encodeURIComponent(u)+’&t=’+encodeURIComponent(t),’sharer’,'toolbar=0,status=0,width=626,height=436′);
return false;
}</script>
<a href=”http://www.facebook.com/share.php?u=<url>” onclick=”return fbs_click()” target=”_blank”><img src=”ADD_IMAGE_URL_HERE” alt=”Share on Facebook” /></a>
you can place this code inside your web page in the place that you want the share button to appear , and change to the link you want to share.
for more info check this, this and this
when you click on a link that goes to same page where the link is, how to keep the view of the page?
By default it goes to the top of the same page.
Regards
Javier
One way to do it is to add # at the end of the href attribute on the links pointing to the current page, either manually or via javascript. I don't think it's a nice way to do it, though...
If you really need this, you could also "disable" the navigation for links pointing to the current page, so that clicking on a link to the current page would have no action...
Something like that should work in jQuery :
$('a.current').click(function(event){
//cancel default click action
event.preventDefault();
}
assuming that the links pointing to the current page have the CSS class current
Can you be more specific? What do you mean with "view of the page"?
Here is a general description of anchors:
If you have a link Link then you need an element on the same page with id="someTarget". When you then click on the link, that element will be scrolled to the top of the element.
EDIT:
Ahm, you are talking about a JavaScript link. In that case you need to have the Javascript retur false so that the default action (namely following the link) is ignored:
<a href="#" ... onClick="myJqueryFunction(); return false;">