Web Navigation loads last - javascript

This problem refers to this site:
http://kittysitting.com.au/contact-us-for-cat-sitting-brisbane-northside/
The problem I'm experiencing is that the navigation menu visually shows last. Usually taking a few seconds after the rest of the page has loaded. The site is loading fine but this makes it appear slow.
My debugging so far:
Disabling Typekit fonts - makes no difference. Fonts load super quick but the whole menu still takes ages to visibly appear even when using 'sans-serif' font.
Disabling Wordpress Dynamic Menu - I tried inserting a purely static menu and it still won't appear for a few seconds after page load. Ruling out anything wrong with Wordpress/PHP.
My guess is it is a Javascript issue or CSS.
My Question for Stack Overflow is:
What is the best way to debug this issue. I'm familiar with Chrome developer tools, but I need to see what exactly is holding it up for the few seconds before the navigation appears.
UPDATE:
Found that a Javascript for responsive navigation is the cause. (If I disable the script it works fine). Have contacted js library owner on github to ask for further assistance as to why its doing it....

Related

Layered navigation loading issue - Maybe JS loading order

Using Magento 1.9.2 and Layered Navigation but latley have been having some issues with the loading category pages. We are getting an irregular issue where the category page just doesnt load, just stays loading forever.
Link to website here
This issue is intermittent and sometimes take a few times to happen (just click various categories from the nav bar and it will start happening). Because of that I think it could be possible that it is the loading order of the js, but I cannot (not that experienced with debugging) work out what to do.
I have tried with inspect element in Chrome but cannot see to actually find the problem.
Could anyone give any idea about how I can debug this? I have checked exception.log and nothing linking it to this.

Link to section on page without using #

I am a novice at the moment & learning a few things along the way but I am stuck with this small issue.
Here is the page in question http://www.theremotedoctor.co.uk/accvolvo.html
I am looking to click on my item selection as shown on the page and scroll to the page of which is the loaded upon a click.
Desktop works fine so this is for IOS device where picture loaded is off the screen,hence the scroll of the item.
I have supplied a before & after code to show what happened.
BEFORE CODE WITH WORKING PICTURE LOADED
<li>Remote uncut key</li>
AFTER CODE PICTURE LOADING NOT HAPPENING BUT SCROLL IS WORKING
<li>Remote uncut keyRemote uncut key</li>
I am now not sure how to rectify this.
If the above code of which I have applied is incorrect I am willing to use a different code that will allow the link to be clicked,pictured loaded & also the scroll to the picture working.
I understand its down to the # being used so already but now confused.
Many thanks for your time.

push down navigator like win8 metro

everybody who has worked with widows 8 metro panel knows that when clicking on the arrow appeared on the left bottom of the screen, it will navigate to the applications page which is totally different from the first page.
i wanna do that on my webpage. when user clicks a block it pushes him down to the element related to that block.
is there any Jquery or JavaScript code for that? FYI i searched a lot and find nothing!
If JS/CSS is in any way similar to XAML - you'd probably want to run some translation animations on two overlaid views as described here: Activate css animation/translation with javascript

Website wont show on IE once I activate scripts. Everything is missing except for the background

So, I've been creating a site based off a template. The site used to work on IE, but I'm afraid that I have made changes since then that causes everything to go haywire. When first visiting the site my grids and alignments are all off and most of the javascript doesnt work. When I activate scripts and ActiveX all of the elements of the site are invisible except for the background. Though, I can still see the source in this instance.
The site (for now) is: http://www.escroft.com/index(main).html
If the site is not displaying when you turn scripts on, you probably have a script error. Open your developer tools with F12, and reload the page; the console should show you what errors you have, and then you're on your way to fixing them.

Do links with javascript slow down a page?

Due to an issue that came up with a website I have to use javascript for all of the links on the page.
like so...
<img src="image.png"/>
Will having many links with javascript on the webpage slow it down significantly?
Does the Javascript run when the page initially loads or only when a link is clicked?
EDIT: For those asking why I'm doing this. I'm creating an iPad site, when you use the 'add to home page' button to add the site as an icon, it allows users to view the site with no address bar.
However everytime a link is clicked it reopens Safari in a new window with the address bar back.
The only solution I could find was using javascript instead of an html based link to open the page.
For further reference see...
iPad WebApp Full Screen in Safari
2nd answer
"It only opens the first (bookmarked) page full screen. Any next page will be opened WITH the address bar visible again. Whatever meta tag you put into your page header..."
3rd answer down
"If you want to stay in a browser without launching a new window use this HTML code:
a href="javascript:this.location = 'index.php?page=1'"
"
I can see this adding to the bandwidth needs of a site marginally (very marginally), but the render time and the response time on clicking shouldn't be noticeable.
If it is a large concern I would recommend benchmarking the two different approaches to compare the real impact.
What do you mean by slow it down?
Page load time? Depends on the number of links on your page. It would have to be a LOT to be noticeable. Execution time? Again, not noticeable.
The better question to ask is are you o.k. with effectively deleting your website for those without javascript?
Also, if you are worried about SEO, you will need to take additional measures to ensure your site can still be indexed. (I doubt Google follows those kinds of URLs... could be wrong I guess).
EDIT: Now that you explained your situation above, you could easily just "hide" the address bar. See this SO question.

Categories