I have this 2-page website which uses angularjs. I like to be able to load page 1 on a certain position by clicking a link on page 2.
Normally, without angular you would give a div an ID like <div id="test"> and put a link on page2 test
On my angular website I use duScroll library to create smooth scrolling.
As a concept I've created the following example website: http://jdenuijl.com/test/#chapter2
this link will open the correct location and smoothscrolls when clicking the links at the top of the page.
On my production website the following link https://escapist.nl/nl/#gallery gets rewritten to https://escapist.nl/nl/#!#gallery and it doesn't open on the correct position.
I've read a lot of questions on stackoverflow about $hashprefix, $locationProvider, $location but I don't see why it's working on my test site and not on my production site. I use some other angularjs functionalities on the production website but I can't find what is causing the rewrite.
What is causing the rewrite and the failure of the normal behaviour?
Thank you very much!
Aleksey Solovey put me in the right direction. I was using the angular-google-analytics module which I found out was loading ngRoute which caused the problem.
Related
Good day All
I'm am working on my first laravel project and I ran into a problem that I cant seem to fix.
I have a few basic views, controllers, and routes that work together with a basic HTML navbar. The problem I am having is that when I click on the next page in my navbar it works fine and it goes to the link but when clicking on another link from that page it adds to the path and then it can't find the page. My routes work through the basic controllers that return a view only for now
For example
Example:
Home page=http://127.0.0.1:8000/
Click on Movies=http://127.0.0.1:8000/movie/index
Click on Movie Actor=http://127.0.0.1:8000/movie/actor/index
from movies to the next view it does not work as you can see the link path is wrong it should be http://127.0.0.1:8000/actor/index
please if anyone has any suggestion that might help.
Please edit your questions with the code and include the relevant code for the future. The code you posted doesn't contain any links (Edit: in your first few comments), which gives me a reason to believe you pasted the wrong thing.
The problem (without seeing any of your code) is likely here.
<a href="movie/index".....</a>
The way this (a) element works, which has nothing to do with Laravel, but is purely HTML, is that it will add movie/index to the current path you are linking from because you are giving it a "relative" URL.
If you add this link from, e.g. yoursite.com - it will link to yoursite.com/movie/index if you do it from yoursite.com/dashboard, it will link to yoursite.com/dashboard/movie/index.
Instead, you do not want a relative path, so you need to start with a / like this.
<a href="/movie/index".....</a>
You can read more about HTML tags here: https://www.w3schools.com/tags/att_a_href.asp.
Check named routes in documentation.
Route::get('/user/profile', function () {
//
})->name('profile');
You can get absolute url in blade template with route helper.
Text
I have the following problem with one of my current projects.
I would like to achieve that when you click on a link which is on a secondarly page, it sends you to the home page but, not at the top of the homepage (by default), I would like that it sends you where a specific ID is.
At the moment I have the following URL in this special link but it doesn't work
link
I have tried different ways I saw in this community but I didn't have luck. At the moment when you click it send you to the homepage but at the top and my ID is almost at the end of the page
How can I fix it please?
Thanks
Kindly use below code on page load. make sure you call this once DOM is loaded. This will scroll the page to this anchor.
location.hash = "#contact-anchor";
I am currently trying to make a transition between pages on a website.
Eg: If a user were on www.example.com/About and they clicked on a link to go to www.example.com/Contact, the about page would fly out to the left, whilst the contact page would fly in from the right.
So far all I could find online was how to do this on the same page with hashtags. But I want to do this with separate pages.
is it possible?
if not is there an alternative and how to do it?
UPDATE
Ok so I did a bit more research and I found this thing called barba.js(http://barbajs.org) that seemed to do what I'm looking for. So I installed the js script file followed the instructions on the site...and it didn't work! All it did was not load my pages correctly and didn't do what it was supposed to do. Anyone know how I can use this(or if there is a better option than barba.js).
-Thanks!
I don't think you can do that with pure html & js, as you load the entire page each time you click on a link if it's not an anchor.
However you can load just a part of the page, and so apply a transition of your choice with Ajax and js
But in the end, you won't really switch from page to page, but only load the parts that you want to update. This is approximately how modern front end frameworks like Angular, React,... are working
Here is a pure js example http://www.w3schools.com/js/tryit.asp?filename=tryjs_ajax_first
Here is a jQuery example http://www.w3schools.com/jquery/ajax_ajax.asp
You are talking about is page transition and it normally happens in SPA (Single Page Application) where there is no hard refresh.
If you are not working in a SPA application I don't think you can do that where you are moving from one page to another by link/button click and a hard refresh happens.
You can choose angularjs one of the famous spa/mvc framework in jvascript and us ui-router to move from one page to another. there are many other you can explore.
I'm using Web2py and using the "PLUGIN_JQMOBILE/LAYOUT.HTML" as the base layout file.
The problem is that when I click on a link, jquery-mobile takes me to the next page -- all fine here.
When I view the source for the page, I see that it still has <title> from the older page.
I caught the problem since I'm using lockerz(addToAny.com) and when users try to share the page on Facebook, the title was coming completely incorrect.
I used the FB developers debug page & saw the title shown.
I can add the og:title, etc, but this problem is biting me for Google+ as well.
Am I doing something incorrect or is that a side-effect of jquery-mobile.. ?
This is because of the Ajax loading by default in jQuery Mobile. You can avoid this problem by using data-ajax="false" in your links or by using a jQuery script to change the page title after loading.
This is an issue regarding, http://www.mccaffreyhautecouture.com/
I am unable to create an external link where the viewer is brought to a specific page within the website. On landing, the viewer must always enter by the landing/main slide page.
This was a purchased template and the entire website is coded in a single index.html file.
My client would like their Pinterest images to link directly to the source or gallery.
Is this at all possible?
I greatly appreciate any assistance.
Thank you,
Stanley Ounarom
It looks like this was written using AJAX to pull in content. The URL doesn't change when nav is clicked, which makes it impossible to link to a specific page w/in the site. The site will need to be further developed to allow for this functionality.
This may help:
jquery ajax history and bookmarking plugin