Html bootstrap showing loading text on page load - html

http://www.silverbladesolutions.com
If I click on any link on the navbar from the home page, LOADING is shown before all the page content. Sme thing happens on links from the footer. If I reload the page, everything works fine. This does not happen with links other than from the index.html.
EDIT: Page code = http://pastebin.com/jeiqqJry

So I found the location of the code that contains the 'loading' section in the html.
When I first click the about button, it takes me to the page, and in the body tag of the page's html, there is this div:
<div class="ui-loader ui-corner-all ui-body-a ui-loader-default ui-loader-fakefix" style="top: 212.5px;"><span class="ui-icon ui-icon-loading"></span><h1>
loading
</h1></div>
When I refresh the page, that div disappears and leaves only the rest of the body. There is something happening when you click on that about link for the first time, it opens this div along with the rest.
Also another thing I noticed is that on the first click, the class of the entire html page goes to the class 'ui-mobile'. Is this supposed to happen? I think something weird is happening when you first click the link, because when I refresh, that class disappears as well. Is there an external js script that might be affecting the html?
What's the html of the actual 'about.html' file look like?

NVM found it. It was some mobile UI thing added from an old version of jquery mobile that we had. updating all the jquery fixed it!

Related

href to same page div ID not working without refreshing page in ruby on rails

In rails views I have links which are linking to Div Ids of same page . When I click on it link the page refreshes and not work exactly.
It works only when I refresh the page then it moves to that div instead of refreshing the page.
Is it due to turbolinks?
e.g
<a href="#videos",class="active">
<div id="videos"></div>
This is not working unless I refresh the page.
How can I fix that issue?
Yes, it's due to turbolinks. Check out this section:
https://github.com/turbolinks/turbolinks#disabling-turbolinks-on-specific-links
or simply:

HTML Link Dropping the Anchor Part

I have a link on a page like this
use our contact form.
Then in about-us.php I have
<div class="extra" id="contactform">
When I click the link, the browser takes me to the correct page BUT
The address bar momentarily flashes up "about-us.php#contactform"
Then it falls back to "about-us.php#" and the browser doesn't move to the anchor.
This is so simple, yet I can't see what is causing it. I have several other anchors with exactly the same format that are working. I also have a link that is called from PHP to the same anchor, and that works.
Mystified!
PROBLEM SOLVED
It was the PHP and Javascript bit of the overall page code that caused the problem. It was overriding the anchor link. Having wrapped the javascript in a PHP if() statement, it is under control.
Moral of the story: look at everything and not just the bits close to the apparent problem.

Getting a link to load a page half way down

I am working on a site and I have a page full of links, What I would like to happen is when one of those links is clicked, the browser will load a new page but only the relevent section of that page..
Does anybody have any idea of how this can be achieved?
I have used this method on one page only before, so that when a link at the top is clicked it will take you further down.. But can this also be done with an external link?
Suppose you have a link :
Link
Then change to :
Link
And
You should have to add id="linktodiv" to the div to show when link is clicked.
For more info see

Link to tag redirecting to top of page when navigating from within page

I have a drop down menu which I include on all my pages using php. On this menu I am using anchors to navigate to various divs on a single page. It is very simple code, anchors with tags in the href, no JavaScript.
Test
navigates to
<h2 id="test">Test</h2>
If I am navigating to the page this works fine. If I am already on the page it goes to the tag then redirects back to the page without the tag (i.e. goes from test.php#test to test.php). What is causing this behavior and how do I fix it?
If you had provided more code then it would have been more helpful. But I am just guessing here what the problem is. You can add the following javascript to your page:
$("a[href^=#]").on("click", function(e) {
e.preventDefault();
history.pushState({}, "", this.href);
});
What this does is target all hash-links and prevent their default behavior and change the URL. But without seeing more of your code, its hard to tell if it'd work. You can also interchangeably use replaceState, which would change the URL without adding an entry to the browser history. Code borrowed from here.

HTML iframe with page links

I know using iframes is not always the best idea, but for my case it makes things easier. I have a website A which contains links to other parts on the same site (using <a name=...). I have a seconds site B which has an iframe containing A. Everything works fine, except the page hyperlinks, if you click on them, nothing happens.
Does anyone know if named hyperlinks are even possible in iframe? And if yes how to make them work.
EDIT:
Seems like I wasn't clear enough. The file is named test.html (http://www.domain.com/embedded/test.html) and contains a hyperlink at the top
Examples
then somewhere at the end there is a link
<a name="examples"></a>
So when you click on the top link the page should scroll down to the bottom link. I have a second page (http://www.domain.com/index.html) with the iframe containing test.html. When hovering over the link (inside the iframe), it shows http://www.domain.com/embedded/test.html#examples. I'm not and iframe expert, but this link seems as it would rather redirect to the actual file (to #examples), rather than jumping inside the iframe. As I said before when clicking on the link nothing happens. Just tested in in Chrome and it works. Seems like this is a problem specific to Firefox.
These parts of your question make me smell something: "links to other parts on the same site (using <a name=...)" and "named hyperlinks"...
A hyperlink for moving to an other part of the same page:
Goto BOOKMARK
And an anchor (bookmark) somewhere else in the same page:
<a name="BOOKMARK"></a>
These are working in every HTML-document, regardless they were shown in the iframeor not.
I had a similar problem. I too wanted a link in an embedded page to point to a bookmark in the containing page. But I am not sure if our circumstances are exactly the same.
A local link such as
<a href="#BOOKMARK">
will only look for an anchor in the same page as the link, i.e. in the embedded page. An approach such as
<a href="containing-page.html#BOOKMARK" target="top">
will only work if your link always references the same containing page. (The target needs to be specified, to display the page outside the iframe.) I am not sure if this will meet your needs.
If you want to re-use a common bookmark name in different containing pages, as I do, the design effectively requires the destination url to be treated as a variable, and that cannot be done using pure HTML. It requires javascript or similar.
It was in fact more elegant for me to add the bookmark link to the containing page, so that I do not need to standardize my bookmark names. This does not even need javascript, just a bit of css.
What I did was to position the bookmark link over the embedded display, so that it looks like it is part of the embedded page. In this example, the iframe is fixed at the top of the page and the bookmark link positioned over its top left corner.
<iframe style="position:fixed; left:0pt; top:0pt;" src="embedded-page.html"></iframe>
<div style="position:fixed; left:0pt; top:0pt;">
My Bookmark
</div>
With a bit of css refinement, this gives some flexibility of layout. For your issue, you may need to stick with javascript.