0
Welcome Guest! Login
0 items Join Now

Roksprocket lists - collapse all

Last Post
Search Topic
    • Steve's Avatar
    • Steve
    • Rocketeer
    • Posts: 87
    • Thanks: 4

    Roksprocket lists - collapse all

    Posted 10 years 3 months ago
    • The first item in the list is not collapsed when the page opens. How can I set-it up so that all items on the list default to collapsed?
    #1169621
    • DanG's Avatar
    • DanG
    • Preeminent Rocketeer
    • Posts: 36750
    • Thanks: 3229
    • Custom work done

    Re: Roksprocket lists - collapse all

    Posted 10 years 3 months ago
    #1169648
    • Steve's Avatar
    • Steve
    • Rocketeer
    • Posts: 87
    • Thanks: 4

    Re: Roksprocket lists - collapse all

    Posted 10 years 3 months ago
    #1169649
    • DanG's Avatar
    • DanG
    • Preeminent Rocketeer
    • Posts: 36750
    • Thanks: 3229
    • Custom work done

    Re: Roksprocket lists - collapse all

    Posted 10 years 3 months ago
    • Steve wrote:
      Thanks Dan. I only have access to the Chimera template forum. Could you post the solution here?

      Sure:
      Franja wrote:
      Hello:

      We would like to share a solution that allows you to have all the items initially collapsed without core changes or adittional JS coding. This has been implemented with CSS alone.

      In all Roksprocket lists we have added a first item that you will see in the pic attached with the name ESCONDIDO (HIDDEN, in Spanish) and we have placed it in first position.

      In our custom-css we have added this CSS (see below); display:none has been applied to the first item. That´s it. It has been implemented in four Roksprocket list modules in this website: www.bernaperles.com .
      .content-repertoire li:nth-child(1) > h4, 
.content-bio li:nth-child(1) > h4,
.content-gallery li:nth-child(1) > h4, 
.content-media li:nth-child(1) > h4 {
	display:none;
}

      Hope this is useful.

      Best regards!

      F. J. Villalba
      www.stilogo.com
    #1169654
    • Steve's Avatar
    • Steve
    • Rocketeer
    • Posts: 87
    • Thanks: 4

    Re: Roksprocket lists - collapse all

    Posted 10 years 3 months ago
    • Thanks again Dan. Unfortunately it didn't work. Just copying and pasting the code would have been too simple!

      The classes of the divs are different. The HTML looks like this:
      <div class="sprocket-lists" data-lists="113">
  <ul class="sprocket-lists-container" data-lists-items>
    <li class="active" data-lists-item>
      <h4 class="sprocket-lists-title padding" data-lists-toggler>Title of first list item</h4>
      <span class="sprocket-lists-item" data-lists-content>Content of first list item</span>
    </li>

      Accordingly, I adpated the CSS to this:
      .sprocket-lists li:nth-child(1) > h4, 
.sprocket-lists-container li:nth-child(1) > h4,
.active li:nth-child(1) > h4, 
.sprocket-lists-item li:nth-child(1) > h4 {
	display:none;
}

      Is there a way to fix the CSS? Thanks.
    #1170141
    • DanG's Avatar
    • DanG
    • Preeminent Rocketeer
    • Posts: 36750
    • Thanks: 3229
    • Custom work done

    Re: Roksprocket lists - collapse all

    Posted 10 years 3 months ago
    #1170257
    • scott's Avatar
    • scott
    • Newbie
    • Posts: 4
    • Thanks: 1

    Re: Roksprocket lists - collapse all

    Posted 9 years 11 months ago
    #1201969
    • DanG's Avatar
    • DanG
    • Preeminent Rocketeer
    • Posts: 36750
    • Thanks: 3229
    • Custom work done

    Re: Roksprocket lists - collapse all

    Posted 9 years 11 months ago
    • Well we have three solutions
      This image is hidden for guests.
      Please log in or register to see it.
      so I'm closing this Topic off as Solved.
    #1201988

Time to create page: 0.067 seconds