Okay, so - weird problem. Basically, I've created a PHP slideshow framework for my site which loads a whole new page each time somebody clicks to the next image. For a more "fluid" experience, I made the next/previous picture links load the next page so that the picture is at the top of the window (I put <a name='slide'></a> right above the slideshow image, and I link to that). However, when I do so, the page title disappears behind my banner at the top. They say a picture is worth a thousand words, so observe: This page looks fine, but click to go the next picture (broken page) and the album title (2010-05) disappears. If you remove #slide from the end of the broken page link, it works fine again. Any suggestions on why this is happening, or how to avoid it?
TIA! :)
In the page:
<a name='slide'></a>
...this an in-page bookmark. The #slide on the URL forces the page to scroll to this point.
If you want the page to load with it scrolled to the top every time, drop in this script:
<script type="text/javascript">
window.scrollTo(0,0)
</script>
Related
Can you please help me solve the problem with this page https://noviero.com/ which is in wordpress? It is a free theme so there is no customer support.
This banner news gets separated when page is opened, but if I zoom the page or click on Windows Restore down everything on the page gets on the right place?
This is the space between elements on the banner when page is first opened:
This is how the page looks like after I zoom in then out. Everything gets as it should be:
Is there something I could do in CSS or what?
https://noviero.com
I want to go from homepage of cece.indiana.edu/index.html to cece.indiana.edu/request.html#speaker. Even though I have the id="speaker", my request is not redirected to the specific id "speaker". I can only get this to work when I am on the request page already. Why can't I get this simple thing to work? Also, I've searched and found answers but none have fixed the problem.
Relevant code/snippets:
<h2 id="speaker" name="speaker">Request a Speaker</h2>
URL: cece.indiana.edu/request.html#speaker
If I am on cece.indiana.edu/index.html: I will go to
Scroll onto Navigation bar
Scroll under "get involved"
Click on "request a speaker"
Be redirected to the bottom of the request.html page. - this is not what I want to happen!
What I want it to do, but it is not happening: If I am on cece.indiana.edu/index.html (or any page)
Scroll onto Navigation Bar
Scroll under "get involved"
Click on "request a speaker"
Be redirected to the H2 with the id "speaker".
This not working correctly in Chrome or Firefox, but it has worked in Safari when I've tried it. I want it to work on all browsers.
It's the JavaScript on your page. If all JS is disabled it works fine. There is JavaScript code messing with the page load and specifically with scrolling and animation, so it's not surprising that it's interfering. Your JS even has specific references to URLs that do or do not have #anchors in them.
In this case it seems you are being sent to the bottom of the page because the "smooth scrolling" code in your JS isn't taking into account that the page may already be scrolled part way. Some browsers will "remember" where you had scrolled to last time you loaded a page, so particularly if you use the back button and then click the navigation item again, you'll end up scrolled too far.
If you have the ability to change the JS, you can fix this by making sure the smooth scrolling code ends by checking to make sure it's actually in the right spot, maybe after a small delay.
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.
I know this sounds petty, but whenever I switch from page to page, the facebook "like" button takes a little while to load. It looks ugly because once it DOES load, it pushes over the "follow" button on Twitter. The google custom search bar does the same thing usually, but faster.
I just want the search bar / facebook button / follow button to load quickly and NOT push each other around.
Here is the current website: http://www.blueskullgames.com
(if you click from page to page on the navbar you will see what I mean)
Any suggestions?
Side Note: I am using a single php custom header for all of my pages.
Thanks in advance!
The facebook button is in an iframe. Add a width to your CSS for the class fb-like. Make sure you do it so it can expand to 4 digits in the counter "balloon" For Rivals.com I did 132px width on the iframe so it does not show up and bully other tags around by displacing them.
I don't know why, but when my page loads, i get scrolled in the middle, but i don't have any anchor aiming on this point...
Now i have to put a <a href='MY-URL#top'></a> anchor in every page for not getting scrolled on the middle...(Firefox don't even get them :0, -webkit browsers do...)
I have many anchor aiming on id's, and a JQuery script for smooth scrolling, but no one for the middle scrolling of pages on load.
You can see that here :
http://www.groupae.be/ediser/2.0/nos_produits.php
What would fire that scrolling on load?
If the page is long enough to have scroll and if you set focus on some element (for example for accessibility features), browser scrolls page in such way that focused element is in the middle of the screen (if scrolls allows to do it, if not it will be scrolled as far as possible).
its ok i found why i was getting scrolled, just the autofocus in the footer form... :/