Grow your CSS skills. Land your dream job.

Go from one tab content to other tab content

  • # December 21, 2012 at 1:20 pm

    Oh boy, this turned out to be lot more to it than I thought. What I am trying to do is this. I have a image which has underlined text on it in upper right corner. That image is in content surrounded by

  • So I developed absolutely positioned div called accessory1 to surround that text on image with on hover.
    Then, in HTML I have this:

    Where the content is I want user to see. Obviously that’s not doing it and I know nothing about js which drives that thing.
    I got it from Foundation grid and customized it quite a bit.

# December 21, 2012 at 1:36 pm

Create a [codepen](http://codepen.io) please dude.

# December 21, 2012 at 1:43 pm

ok, give me a few here, thanx Andy

# December 21, 2012 at 3:12 pm

@andy_unleash, Andy, I am unable to recreate it even close resembling what it looks like on the web. Oh man, it’a complete mess.

# December 21, 2012 at 3:24 pm

The best way to use codepen is to strip out everything but the parts you’re having trouble with.

So copy the container and the element that’s the problem and the CSS/JS relevant to those bits only.

The benefit is, if we can see and play with the code directly we can solve your problem.

# December 21, 2012 at 4:17 pm

@andy_unleash, Ok Andy, we were brainstorming this here for past half an hour or so and decision was made that we will brake up that page to 4 different pages instead using tabs to manipulate content for presentation depending on the product category in those tabs. I see lot more benefit to that than what we have currently on. Lighter pages, no need for js, navigate from one page to another from within the content of each page anyway you like or if needed. Each page will get descriptive url applicable to the product category presented instead just one url like orders or shopping cart and last, pages will be less weight then the current 70kb one page design. Cheers.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".