SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Hybrid View

  1. #1
    SitePoint Zealot Lance's Avatar
    Join Date
    May 2005
    Location
    Maine, USA
    Posts
    107
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Using DOM to format based on string value

    I have a dynamically-generated menu, that resides in an unordered list. I want to be able to change the font styling for only one of the items (make 'contribute' red instead of blue).
    I thought it might be possible to explore the UL through DOM, and then write some css inline if the string matches. Does this make sense, and if so, anyone have any thoughts on how I would do this?

  2. #2
    SitePoint Wizard chris_fuel's Avatar
    Join Date
    May 2006
    Location
    Ventura, CA
    Posts
    2,750
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    In some cases you can actually pull off style changes if it's simple events like hover. Do you have an example piece of code and what event you want to trigger the styling change on?

  3. #3
    SitePoint Zealot Lance's Avatar
    Join Date
    May 2005
    Location
    Maine, USA
    Posts
    107
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'd like to get the menu item to change at page load. Here's the template code and the final code from a rendered page:
    Code:
    div id="navigation" class="menu <?php if ($primary_links) { print "withprimary"; } if ($secondary_links) { print " withsecondary"; } ?> ">
              <?php if (!empty($primary_links)): ?>
                <div id="primary" class="clear-block">
                  <?php print theme('menu_links', $primary_links); ?>
                </div>
              <?php endif; ?>
    Renders as :
    Code:
    <div id="navigation" class="menu withprimary ">
                          <div id="primary" class="clear-block">
                  <ul class="links-menu">
    <li><a href="/xxx_proto/about-xxx-xxx" title="Bio">About XXX </a></li>
    <li><a href="/xxx_proto/im-xxx-0" title="xxx endorsements">I&#039;m with XXX</a></li>
    <li><a href="/xxxproto/newsroom-0" title="News updates about xxx">Newsroom</a></li>
    <li><a href="/xxx_proto/get-involved">Get Involved</a></li>
    <li><a href="/xxx_proto/node/51" title="Contact">Contact</a></li>
    <li><a href="/xxx_proto/contribute">Contribute</a></li>
    </ul>            </div>
                        
                    </div> <!-- /navigation -->
    It's that last <li>, Contribute, that I want to be able to access individually.


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
  •