Link fragment bug on android? - html

Im maintaining a site with the link fragment below. There isnt an element with an ID of top on the page however clicking it still takes you to the top of the page. Is this because the default behavior of any link fragment is to take you to the top of the page?
There is also a weird bug with it on android. It appears multiple times and works the first time but the second time you click it does nothing.
Top

Yes, all undefined anchors take you back to the top of the page.

Related

Browser tab not showing full URL?

I'm having a odd issue with this site I'm building:
http://limetreeyoga.uk
If you click on "about" it takes you to the "about" page but if you refresh the page it takes you back to the home page?
Same with the other pages, its also not showing the "title" tag in the browser? I have no idea why, can anyone help?
Cheers
T
This website uses FRAMES - extremely old (i.e. outdated) technology....
The outer frame always stays the same, that's the reason for the reload problem. Only the inner frames change when you click the menu.
ADDITION: In fact, it seems you have a complete regular (useable) document structure inside the first frame. Try to erase all HTML outside the first <frame> element - that might even work... (although I didn't look into it in detail)

Page render issue - (With AngularJS)

I'm having a weird issue with page render while using AngularJS and Chrome.
I'm creating a cart icon that only shows when there's at least one element in my cart. The code is:
<a ng-style="{visibility:myCart.checkCartExistence()?'visible':'hidden'}" href="/cart"><span ng-bind="myCart.getCartQty()"></span></a>
Here's the problem:
Top image shows the page as soon as an article is added to the cart.Bottom image shows the same page when you scroll down a bit.
The cart icon and the quantity aren't displayed immediately and only show up when you scroll down the page. The weirdest thing is that if you scroll all the way up, the cart icon disappear again.
The same happens with the title that is set dynamically, when you're at the top of the page it shows TITLE A, if you scroll down a bit it updates to TITLE B. If you scroll up it shows TITLE A again.
Unfortunately I can't post any link to the page so I'm wondering if anyone knows what this is without actually seeing the page.
NOTE THAT:
This happens with Chrome.
I tried with other browsers and it looks like they don't have this issue.
I managed to make it work somehow, clearing the browser cache but it came up again soon after.

Why am I getting a doubled menu when I click the link for my main page?

Whenever I click the "Home" option on my menu (left hand side, frames), a second copy of the menu page appears on the left side of the main window. The html of this link is identical to the other links, which work fine. As I'm just developing the site at the moment, the HTML of all the links is also identical. There is no code difference between this link and the others in any way, only the behavior.
The doubled copy of the menu is a phantom. It will not double itself again, and goes away when any other link, other than the home page, is navigated to. I'm currently in school and this is my first ground-up project, so I'm sure it's something stupid and simple.
Well Aarron, your problem is indeed quite obvious. After looking for hours, the solution the whole time is that your "Home" link is pointed at Index.aspx, which is the page with your frames, instead of Main.aspx. You were thinking of Index as your home page, which it is, but linking there in this context gave you frames within frames, instead of the default opening display page you were aiming for.

Refresh page directing it to a particular div using HTML5/CSS3?

I am making a simple website and I am encountering a problem whenever I reload it.
I placed my menu at the middle of the screen and when you clicked it, it needs to go down to the content. My problem is, whenever I reload it, it would still go up and show the upper picture. What I want is that after one of the menu is pressed, the menu should now stay on the upper corner of the screen without showing the upper picture (Sample website -> http://ec2-54-84-168-45.compute-1.amazonaws.com/Teapop/)
It seems like my url code that directs it on a particular div (e.g menu#teapop_nav)` doesn't work as I expected after I deployed it on the hosting site even though it works well on my local build.
Without using any javascript code, is there a fix for this using html5/css3?
Thank you.
i just tested it on my computer (chrome & firefox) and it seems to work. And also on page refresh. The picture is always on the top.

Hold website position when navigating

Is there a way to make it so the page doesn't shoot to the top of the site when clicking different links in the navigation bar?
e. So say I'm browsing my site and I'm scrolled down a little bit. Then I click on a link that navigates to a different page on my site. It automatically scrolls to the top. Is there a way to make it not do that.
instead of simply linking to a page, you could link to an anchor on that page using
link text
if that anchor is placed properly on the target page, you will not experience the jump back to top every time you link to another page. hope this helps
If this is the problem I'm picturing:
Change your links to point to <a href="#"> or <href="javascript:void(0);">
If you're going to different pages, you can use a link like:
My Link
Down in the page:
<div id="Section5">
Stuff!
</div>
This is the way that the web works. But still you can do a few work a rounds but each one will take a little work.
First option:
When you click on any link on the page, get the margin of the link from the top, then add it as a parameter to this link, and only then do the navigation. (the format of the line will be like page.html#margin-from-top).
Then in the new loaded page, you can look for this value and do the scroll. (I prefer the scrolling with a little duration).
Second option:
Another idea is to stay always on the same page and only change the content of it. you can do that with a little effects too.
It seems, too, like you might want to use a mooTools ScrollTo affect or possibly even invoke an AJAX method like SWFAddress.
Depending on exactly what you're trying to do, you may be able to accomplish it without using any fancy javascript, but it will depend on the inclusion of labels/etc. on your target page (as has been mentioned before).