Add link to materialize tab - tabs

I am using the materialize tab that is in the page materialize tab
My goal is to add a link in the menu that go to CreateAlbum tab.
I tried href="#CreateAlbum" but it didn't work. How can I do that?
if i link
<a href="{{path('homepage')}}#CreateAlbum">
or
<a href="#CreateAlbum">
don't work and don't reload page

Related

Angular 6 - how to go to another view by clicking the icon?

i dont have the idea how to do it. please can you give me an idea on how to go to another view by clicking the icon on the Angular6? Thank you!
To change view in Angular(without reloading page), you need Routers.
You can wrap your icon inside an anchor tag <a> and use routerLink to define the view you want to load when a user clicks on the icon.
For example, you are building an e-commerce site where you have an icon for contacts and one for a shopping cart. You can define view for each icon like this:
<a routerLink="/contacts" routerLinkActive="active">
<mat-icon matSuffix>contacts</mat-icon>
</a>
<a routerLink="/shopping_cart" routerLinkActive="active">
<mat-icon matSuffix>shopping_cart</mat-icon>
</a>
So when the user clicks on contacts icon, contactsComponent will be loaded in your view and the URL would change to yourwebsite.com/contacts.
You can learn more about routers and material-icon.

How to pick the page icon tab and put as icon link in my body page Html, Css

I was doing a page with a list of sites I need to visit daily, such as exercise to learn Html, CSS. I would like to know if it is possible to create a link with a page icon that is in the upper tab of the browser (chrome).
Ex: I want to list StackOverflow on my site. So I create a link and for the icon, I want to use the image that is on the tab of the page itself, as in this:
You can use:
https://plus.google.com/_/favicon?domain=www.yourlink.com
example
<a href="">
<img src="https://plus.google.com/_/favicon?domain=www.stackoverflow.com"> Stackoverflow
</a>
If I'm correctly getting what you want, you'd need to either have a local copy or link to the sites' favicon, like so:
<img src="https://cdn.sstatic.net/Sites/stackoverflow/img/favicon.ico" />

Make a duplicate of a facebook share popup

I try to make a duplicate of the share button on the following site (it's at the bottom):
WARNING! THE IMAGES ON THIS SITE CAN BE VERY DISTURBING!!!
http://www.bbc.co.uk/news/special/2014/newsspec_8702/index.html
If I click from there it looks like this:
If I copy the code:
<a href="https://www.facebook.com/dialog/feed?app_id=58567469885&redirect_uri=http%3A%2F%2Fwww.bbc.co.uk%2Fmodules%2Fsharetools%2Fcallback%3Fst_cb%3Dfacebook%23state%3Dfeed&display=popup&link=http://www.bbc.co.uk/news/magazine-29205427&name=Voices%20from%20the%20mall%20-%20remembering%20the%20first%20terrifying%20hours%20of%20the%20Westgate%20attack%20a%20year%20ago%2C%20via%20%40BBCNewsMagazine&description=Shared%20via%20BBC%20News&picture=http://newsimg.bbc.co.uk/media/images/67373000/jpg/_67373987_09f1654a-e583-4b5f-bfc4-f05850c6d3ce.jpg" target="_blank"><span>Facebook</span>
</a>
And put it in a html or jsfiddle:
https://jsfiddle.net/clankill3r/6oufc1pL/
Then instead of a popup I get a new window and the image is gone:
Why is that? And how can I change this behavior.
edit:
If I click the popup on the original site the link changes to this for some strange reason:
https://www.facebook.com/dialog/feed?app_id=58567469885&redirect_uri=http%3A%2F%2Fwww.bbc.co.uk%2Fmodules%2Fsharetools%2Fcallback%3Fst_cb%3Dfacebook%23state%3Dfeed&display=popup&link=www.bbc.co.uk/news/magazine-29205427&name=Voices%20from%20the%20mall%20-%20remembering%20the%20first%20terrifying%20hours%20of%20the%20Westgate%20attack%20a%20year%20ago%2C%20via%20%40BBCNewsMagazine&description=Shared%20via%20BBC%20News%20Magazine&picture=http://www.bbc.co.uk/news/special/2014/newsspec_8702/static/img/fb.png
Change the picture= to image= like this:
<a href="https://www.facebook.com/dialog/feed?app_id=58567469885&redirect_uri=http%3A%2F%2Fwww.bbc.co.uk%2Fmodules%2Fsharetools%2Fcallback%3Fst_cb%3Dfacebook%23state%3Dfeed&display=popup&link=http://www.bbc.co.uk/news/magazine-29205427&name=Voices%20from%20the%20mall%20-%20remembering%20the%20first%20terrifying%20hours%20of%20the%20Westgate%20attack%20a%20year%20ago%2C%20via%20%40BBCNewsMagazine&description=Shared%20via%20BBC%20News&image=http://newsimg.bbc.co.uk/media/images/67373000/jpg/_67373987_09f1654a-e583-4b5f-bfc4-f05850c6d3ce.jpg" target="_blank"><span>Facebook</span>
</a>
Does this work for you?

Highlighting Current Page Menu Tab Using HTML and CSS

Can someone please offer me some advice?
I'm trying to customise a website and its HTML Nav Menu. By default, the menu already highlights the current tab for all existing pre-built pages.
http://webservices.retrotorque.com
I've added a new page to the website - Website Design - and I've added a tab to the menu for that page. All fine. But I can't find a way of making that tab become highlighted for only when that page is viewed.
Here is the existing code for one of the default tabs, which works fine.
<li class="first <#tag:homesection /#>">
Home
Here's my code for the menu tab I've created for my new page:
<li class="levelone <#tag:webdesignsection /#> ">
Website Design
<li>
My problem is that I can't find where to define:
<#tag:webdesignsection /#>
So I may need to find another solution.
I've thought of another approach:
<li class="levelone active">
Website Design
<li>
This code does work, but only in so much as the tab is always highlighted, whichever page is being viewed.
Is there a way of wrapping this up in a 'conditional'? So that it only applies when viewing the websitedesign page. And I could have a non-active alternative, conditionally set up for when viewing any of the other pages.
Thanks.
i think you should put JQuery there that can addClass and removeClass active from li element.
there is for example
var url = document.URL;
$('#example li a[href="'+url+'"]').parent().addClass('active');

Moving to a tab and a specific location within that tab

I have a page with a link on, and three tabs. Default view is Tab 1
The tabs are below the page fold
The end result should be that, when the person clicks on the link, it should open Tab3 and move the page up so that the user can view the content of the tab.
As it stands now, the user clicks on the link and it opens the tab3, but because the tabs are below the page fold, it seems like nothing is happening.
I want the screen to move down to the tab as well. Im currently using onClick="parent.location='#contact'" to open the tab
This is the code for the link
<form>
<input class="listbutton" type="button" onClick="parent.location='{site_url}
{url_title text="`$action_object->m_listing_info->title`"}/
{route_suffix for="listings"}{$action_object->m_listing_info->listing_id}#contact'"
value="{translate text='contact_owner'}" title="{translate
text='listestablishmentforfree'}">
</form>
This is the code where it's linking to
<li>
<span>{translate text='contact_owner'}</span>
</li>
As you did not have code, so what i can understand i am helping u
$('#anchorID').click(function() {
$("#contacts").focus();
});