im nearly ready to launch my website but i have a problem i cannot sort out.
ive built the whole website using wordpress and buddypress.
due to the picture in my header being very big and ending 450px down the page, you have to scroll down to access the buddypress menu in the relevant page (the one above the activity stream etc) which is exactly where i want it, removing my header is not an option, now the only problem i am having is that when i click the tabs in the buddypress menu say from activity stream to say my messages instead of the page laoding and taking me back to this section it takes me to the very top of my header so i have to re-scroll back down to the page i was after.
I need the page to stay at the same point after page reload so that the menus can be flicked through without having to scroll down to it again everytime a link is pressed. how do i achieve this? can you please help me sort this out….i have no problems adding or editing codes if i know what code needs changing and what to add to make it do this. thx
Im guessing that if you look in the url bar it is adding a # to the end of the url. You need to override the default click event on the a tag so that it doesnt jump you to the top. Im not sure how that will affect the stuff that is going on in the BuddyPress plugin.
Related
I've added a few anchor links on my angular project to help with page navigation and they seem to work.
However, when I'm testing them they only seem to work for one click; when I scroll back to the top of the page and click them again nothing happens.
The only way around it is to click to a separate page, come back and they work again.
Is there any way of fixing this so they allow multiple clicks without having to go back and forth between pages?
Thanks
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.
For a project a site is needed where when first loaded an animation appears that fades away and reveals the content of the site. I am fine with creating the animation and all. What I am not sure about is where to place it.
From a site ia point of view I see it like this. Either have the animation on the index page and once done remove that element with js or $ and reveal the index page. This means a reload will always show the animation again. This also means a click on the main logo that leads to the index page will also play the animation again. Something not really wanted or needed.
The only other option I see is having the animation on the index page and once done redirect to the home page where the site content is located. Like this a click on the logo can be set to either the home page or the index page. The info on the home page is also visible without watching the animation again since the home page has a separate nav link in the menu. Only if desired can the animation be watched again by clicking on the main logo.
From my perspective it will be the later. Though I ask you is this good practise? Is it OK to just have an animation on the index page and everything else on the home page?
I was thinking to either post this in https://ux.stackexchange.com/ or https://graphicdesign.stackexchange.com/ but I think this more concerns code architecture rather than design or ux because as mentioned the animation could also be loaded dynamically on the index page and once gone the content is shown on the index page. So you see I am not asking for opinion but rather for the right logic to tackle this task.
What method is best applied for this scenario? Would you consider having the animation on the index page and then redirect to the home page?
Linked
https://stackoverflow.com/questions/22090313/show-an-animation-before-show-my-index-html
https://stackoverflow.com/questions/503093/how-can-i-make-a-redirect-page-using-jquery
http://www.submittoday.com/splash_pages_and_search_engine_optimization.html
http://stackoverflow.com/a/22090389/1010918
https://stackoverflow.com/questions/30573395/page-loading-animation-method
https://stackoverflow.com/questions/1964839/jquery-please-wait-loading-animation
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.
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.