SitePoint Sponsor

User Tag List

View Poll Results: Was this helpful?

Voters
0. You may not vote on this poll
  • Yes

    0 0%
  • No

    0 0%
  • Not what I was looking for

    0 0%
Results 1 to 4 of 4
  1. #1
    SitePoint Member
    Join Date
    Nov 2013
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Expandable Text in Sharepoint Site within a column - I have no idea what I'm doing

    I am trying to structure a part of this Sharepoint 2007 site to look something like this:

    Acronym/Term Description Explanation |> (the explanation would ideally have the arrow - yes that is my arrow - that allows you to click to expand or hide the text)

    Acronym/Term2 Description2 Explanation2 |>

    Acronym/Term3 Description3 Explanation3 |>

    I got a good start with the columns portion (I think), but now I have no clue how to get the expand/collapse function into this:

    <SPAN class=heading>HEADING</SPAN>
    <HR style="WIDTH: 100%; HEIGHT: 1px; COLOR: black">
    <table>
    <tr>
    <td><SPAN CLASS=BODY><FONT size=2>Acronym/Term</SPAN></td>
    <td><SPAN CLASS=BODY><FONT size=2>Description</SPAN></td>
    <td><SPAN CLASS=BODY><FONT size=2>collapsed/expanded text</SPAN></td>
    </tr>
    </table>

    All I have to work with is a content editor web part that designates a place where I can enter in HTML into the content editor.

    Please help!!

  2. #2
    #titanic {float:none} silver trophy
    molona's Avatar
    Join Date
    Feb 2005
    Location
    from Madrid to Heaven
    Posts
    8,237
    Mentioned
    239 Post(s)
    Tagged
    1 Thread(s)
    I don't work with Sharepoint so I can provide little help. I'm curious about the poll though. I don't see what it has to do with your question

  3. #3
    SitePoint Member
    Join Date
    Nov 2013
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I don't know I was just playing with the site as I'm new to the sitepoint.com site.

    Could you assist with what I'm trying to do?

  4. #4
    #titanic {float:none} silver trophy
    molona's Avatar
    Join Date
    Feb 2005
    Location
    from Madrid to Heaven
    Posts
    8,237
    Mentioned
    239 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by cbrust View Post
    I don't know I was just playing with the site as I'm new to the sitepoint.com site.

    Could you assist with what I'm trying to do?
    Expanding/collapsing would be done with some JavaScript and there are hundreds of ways to do so. You may want to Google it a bit.

    Since you're using HTML, then I suspect that you're doing this to be viewed in a browser and therefore I think that it may be your solutions.

    Although placing all the text and info into a table doesn't work well with collapsing/expanding text.

    Your HTML is not semantic. I would change it to something like (keeping the current structure)

    Code:
    <h1>HEADING</h1>
    
    <table>
    <thead>
    <th>Acronym/Term</th>
    <th>Description</th>
    <th>Additional Info</th>
    </thead>
    <tbody>
    <tr>
    <td>This could be a term</td>
    <td>Here would be teh description</td>
    <td>some more text</td>
    </tr>
    </tbody>
    </table>
    or


    Code:
    <table>
    <caption>HEADING</caption>
    <thead>
    <th>Acronym/Term</th>
    <th>Description</th>
    <th>Additional Info</th>
    </thead>
    <tbody>
    <tr>
    <td>This could be a term</td>
    <td>Here would be teh description</td>
    <td>some more text</td>
    </tr>
    </tbody>
    </table>
    But if you want to follow the route of the collapsing/expanding text, probably this code could be better

    Code:
    <h1>HEADING</h1>
    <h2>Acronym/term</h2>
    <h2>Description</h2>
    <div class="expand">
       <p>whatever text you need to include</p>
    </div>
    And then, that div would expand/collapse (once you added the javascript)

    Also, you can look into jQuery's accordion for collapsing/expanding text.


Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •