Two active links at the same time on wordpress - javascript

I have this "problem" with my website that is, when i am at the Home Page i have another link of my menu that is not a page, who stays active because i used an anchor on that link.
Basicaly i added the https://dama.ci/notre-histoire url to that link so when i'm on another page of my website i can actually click on the link and go back to the home page where the anchor is attached and this is what causes the problem.
So my question is, since that link on the menu isn't a page what could i actually do to have the link activated only when it's clicked ?
Is there another way to achieve what i'm trying to have on the website ?
If you want to check the site here is the URL

You can try with another way, you should remove current-menu-item class from that li onload using js i have added sample js code for you
$(document).ready(function() {
$(".menu-item-538").removeClass("current-menu-item current_page_item");
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Change your “Services” link URL from:
https://dama.ci/#inspiration
to simply:
/#inspiration
i.e. remember to add your domain’s trailing slash when you use the full or root-relative URL in your links.
When you say two menu items get highlighted at the same time, you mean “inspiration” and “Home”? If yes, you’ll need to make the “Home” link point to the top of the homepage (e.g. with a URL like /#inspiration). Otherwise, it gets highlighted by your theme as the current page.

Related

Linking to a specific data target on a separate page

I've been searching and searching and for some reason I cannot figure this out as simple as it probably is.
I am trying to link a logo from a list on a home page and connect it to the full details related to it on a separate page. The full details on the separate page are in a carousel being controlled by data targets, How can I link the logo from the home page to the specific data target on the full details page?
The best method would be to add a hash for the anchor tag to your url, and then use javascript to read the hash and then scroll to it! Here's a duplicate question with an answer that successfully accomplishes the effect jQuery scroll to ID from different page
If I understand the question, assuming the logo is displayed in an <img> tag, try wrapping an anchor tag around it with an href like so
<img src"myImg.jpg>

Reacting differently to links leading to the same page with vanilla JS

I have two html pages, linking to each other with tags. However, the behavior of the opened page needs to be different, based on which link is clicked to get there.
Example: One of the links is in a drop down header menu, and the new window should start with this menu open and then retract it.
The other link is in a blurb on the front page, and the opened page should therefore not start with the header dropdown opened and then retract it.
Is there a way to modify behaviour of the opened page, based on which link is used to get there?
Cheers.
Pass data to another page as href value. Grab this data using PHP and change the behaviour of new page depending upon different values of this data.
Some reference : Passing values to another php page using anchor tag

How do I open a link to specific div in cordova application

I'm currently working on a mobile application using Cordova.
When I click on the 'reviews' button on one page, I want it to open up the next page (which shows more about that particular company) and automatically scroll down to the 'reviews' div on that page.
I've tried adding a scrollTop within the onclick function, adding a # to it (this breaks the link completely) and many other different things.
How can I do that? Any help would be greatly appreciated!
***Edit
a onclick="' + showpage + '"
this url is bring created from json info that is being brought in depending on certain criteria.
The page that it is on is a list of businesses, then if you click on the name, it goes to a page about that particular business. Currently when you click on the reviews, it also goes to the particular business but I want it to load the business page then automatically scroll down to the reviews div (This is being created dynamically as the page is loaded).
div class="star-review' <-- this is the div that I'm wanting it to scroll into position to.
Avoid href in a tag....
Use this simple workaround in JavaScript
<a id="scrollToTop name="scrollToTop" value="Send">
Scroll To Top
</a>
<script>
$("#scrollToTop").scrollTop(
$("#scrollToTop")[0].scrollHeight);
});
</script>
The href was being built into a function and then showpage was spitting that link out, I solved the problem by rebuilding the href without showpage and then I was able to add my #reviews to the end of it. :)
Cordova creates application using single page architecture, so it creates a link between page using hastag.
data-role="page" id="mypage"
In your tag you need to pass data-role as page, and you need to pass its id.
When creating link on the page, you need to write link tag as mentioned below:
My Page Link
Thanks
Amit

How to disable deeplinking in angularjs?

I am now trying to implement a page with Angularjs. But the problem is that the behaviour of the anchor element in the page seems to be overrided by Angularjs.
So for the below anchor element, I just want to present a link for the user to go to the destination.
Pay!
So I just want to direct the user to the page at payment/123. But if I click on the link now, it just try to come out with a new url by adding the link in href to the current url. Say e.g. if the current url is http://www.example.com/shopping, then it tries to direct me to http://www.example.com/shopping/#/payment/123 but not what I want (http://www.example.com/payment/123).
Any idea how I can solve this?
That was a bug with rc11 and rc12. Try 1.0.0 final.

Toggle menu issue

I've got a toggle menu, please see http://jsfiddle.net/Wp2em/41/ for code and functions.
On the real site which is using the same code, everytime when you click on h3 (Category 1, 2 & 3 which is an a tag at the moment), it toggles its submenu down a bit, then the page changes to a new h3 linking page, and the submenu collapses together on the new page.
I'm just wondering is there any way I can tell the submenu to be open when its parent page/the new h3 linking page is opened? Please see this bank site which has the side bar effect I'd like my toggle menu to be.
Thank you in advance!
Here is my fiddle
all you will need to do is put the class "currentPage" on the li that you are currently on and the menu should be open after the page loads. I also moved some of your css around so it should move a little smoother now.
** Updated fiddle code. It will now look at your current URL and set the link that matches with it to the currentPage. Also I added that if another menu is open it will close itself if you click on another parent menu
** Updated fiddle code. Ok now if you click on the arrow the menu will expand and not go to the link(like the bank site). Also I changed it where you will have to put the anchor tag in all parent H3s.
This is not too simple. I've had a very similar problem, although I was posting the page back to the same url so I used a hidden field to store a list of the id's of the H3's which were open.
You I think will have to use a cookie to do this as you're navigating straight to the new page. The idea is you create a cookie and set a value on it every time you open an H3 and remove it every time you close it. You can use this plugin to do this. Then when you open the other page, the script reads the H3's which should be open out of the cookie and opens them.
Another route would be to use Ajax to post the open/closed H3 information back to the server which would store it in session data and use it to build the HTML of the new page so the right H3's were open.
If the page loads and the submenu (ul.second_level) is generated (i.e. from php), parse an active css class on the submenu that must be visible.
ul.active {
display: block
}
ul.second_level {
display: none
}
This is in addition to your click function. Do not trigger the click event since it starts the animation (which I presume you don't want).
Update:
It is quite basic stuff, but I do not know how the HTML code for your menu is created. If you are using php and a database (for example) to create the menu, check every submenu item with the page you are on. If the page is one of the pages in the submenu, set the class 'active' on that submenu. The CSS does the rest (displaying this submenu and hide other submenus).
If you have a static page, use javascript to check on which page you are with window.location.href for example. The rest is the same.

Categories

Resources