I am working with a tabs layout and was wondering if there are any alternatives to anchor links when only using html and css? Are there subanchor links?
I want to link one item in the 1st tab to another item in the 2nd tab. What could I use that would allow me to do this? Anchor links aren't currently working due to the tabs layout.
Thanks!
Code: http://codepen.io/anon/pen/xsaht
For example, on tab 3, having a word from header 5 link to another word in header 4.
I found an alternative to this,
Instead of using an accordion, anchor links will work within the tabs. I created a table to contain the main headers of the sections at the top with anchor links. It also speeds up the site a little by getting rid of the accordions.
Code: http://codepen.io/anon/pen/pkvoI
Related
I'm new to webdevelopment and I am creating a responsive dropdown navigation bar with Jekyll and I followed this wonderful tutorial by Tania Rascia.
The problem is that there are no hrefs in Tanias tutorial so when you click on an item you don't get redirected to the specific page. Which of course is not a problem because you can just insert your own hrefs.
But I have a specific problem with the dropdown menus. Since all the dropdown menus open up when you click on them you also automatically click on the href which brings you to the specific page even though you just want to see the dropdown items. I know that I can just stop using an href and there wouldn't be a problem but I want the possibility to actually click on "Services" or "Portfolio" and get on a page that lists those items. Tania made this little Unicode arrow as an indicator that you can click the link to open up the dropdown (It's in the SCSS).
I made my own codepen where you can see my problem. If you click on the dropdown menu "Services" or "Portfolio" you will get redirected to wikipedia.org instead of seeing the dropdown items.
Services
Is there a possibility that I only open the href when I click on the word itself (For example "Services") and otherwise if I click the surrounding background or the little arrow I open the dropdown-menu? If it's not possible which is the common way to solve this problem?
The problem is the js display the dropdown & redirect, all you have to do is to add a html tag and redirect by it.
Here's your codepen with the needed modification https://codepen.io/anon/pen/NJrZwE
Js part
$('#wiki').on('click', () => {
document.location.href = "https://en.wikipedia.org";
});
Html part
<span id="wiki">Portfolio</span>
<ul class="nav-dropdown">
...
I want to change the way Tumblr default theme shows the pages links (just under the Title and Description.
Some time ago it just showed all the links and if they didn't fit on one line, they just went to the next line.
Currently there is only one line of links that needs to be scrolled horizontaly using click n drag (or sliding with the finger in smartphones).
I want to change it as before so all the links can be shown without needing to scroll.
I am having to guess here as you have not provided any code or an example, but if you want to show post tags stacked on top of one another (like a list).
Then change this code:
.inline-meta .meta-item {
display:inline-block;
...
}
to this:
.inline-meta .meta-item {
display:block;
...
}
Or write your own style tags as this css is inherited I believe.
So at the bottom of your style tag just add the property display:block to the .inline-meta .meta-item element.
I want to use Anchor Tag for jump to relevant section of a page but i want to done this jump from any page for example WORK.html page(by menu).
I have a menu that there is in all pages. i want with click on any option, jump to relevant section but when am in another pages too.
such as this image: menu image!
in the image, I want to go from WORK page to Scaffolding or Typography that are on a single page.
this code is in menu codes in WORK.html:
go to relevant section
but should instead of "STYLE.html" jump to relevant section from "STYLE.html"
how to done this work???
Try to add an id to the div regarding the relevant part of your page. So put this preceded by the symbol id # at the end of the page link.
For example:
go to relevant section
I'm aware that you can use html anchors to link to parts of a certain page.
However, I can't get it to work for the css template I currently have.
The navigation in the format provided works, but within a subsection of the page, the #name link stops working. I tried putting the id within the header, an tag and the panel id, but none of it works. Here is the source
view-source:http://matthewpiatetsky.com/cs103/
specifically the link to #p1 doesn't work
I'm currently working with Spry Tabbed Panels in a Site. I've nested a set of panels inside of another set of panels. My problem is that 2 out of 4 tabs in the first panel don't work. And two out of four tabs in the nested set of panels don't work.
Here is a link to the site for an example:
http://emilymagnuson.com/trustbank/index.html
Your HTML structure looks broken. You need to fix that if you want spry to work properly. For example on line 336 of the source code there is an extra </div> closing tag. I would review your code and make sure that all your HTML elements are placed properly.