Keep highlight until next #id

  • Resolved mkherani

    (@mkherani)


    12 years, 1 month ago

    I really love this plugin! I’m building my site at http://bikanta.techiedivadesigns.com/

    I’ve gotten everything to work except for the highlights. I’m using an Elegant Themes framework, and I put the following in my custom css:

    a.mPS2id-highlight{ color: #000 !important; background: transparent; }

    This works great; however, I want the menu item to stay highlighted until you get to the next #id. For example, when you’re in the middle of the “Technology” section, the highlight goes away, and nothing is highlighted.

    Is there a way I can do this? My #id’s are linked to the titles of each section.

    https://ww.wp.xz.cn/plugins/page-scroll-to-id/

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author malihu

    (@malihu)

    12 years, 1 month ago

    Hello,
    At the moment, in your markup you have the section title (with the id) and the section content separately. Since the title has the id and its height is about 150px, it “leaves” the screen quickly as you’re scrolling down, making the corresponding highlighted link to go off (since the id is no longer visible in the viewport).

    In order to have a highlighted link “always on” (accounting for both title and content) you need to wrap each section title and content inside an outer div which will have the id (instead of just title). For example: 

    <div id="team">
    <div class="et_pb_section et_pb_fullwidth_section" /> /* title container */
    <div class="et_pb_section" /> /* content container */
</div>
    Thread Starter mkherani

    (@mkherani)

    12 years, 1 month ago

    Thank you!

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Keep highlight until next #id’ is closed to new replies.

Tags