Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New to the CF scene
    Join Date
    Feb 2012
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Conditional Statements in css

    I am working on a ul css category list for wordpress and it works fine but I was curious if there is any way, pure css, that I can do something like:

    if(li li == true){
    li{background-image:url(some_image.png);}
    }
    else{
    li{background-image:url(some_other_image.png);}
    }

    the reason I'm asking is that I want a background image to indicate if there is expandable content (such as an arrow indicator) and I want to make it conditional on there being a list embeded in another list and I would like to use css and not php or javascript. Is this possible?

  • #2
    New Coder
    Join Date
    Feb 2012
    Posts
    25
    Thanks
    0
    Thanked 5 Times in 5 Posts
    Quote Originally Posted by 512designcrew View Post
    I am working on a ul css category list for wordpress and it works fine but I was curious if there is any way, pure css, that I can do something like:

    if(li li == true){
    li{background-image:url(some_image.png);}
    }
    else{
    li{background-image:url(some_other_image.png);}
    }

    the reason I'm asking is that I want a background image to indicate if there is expandable content (such as an arrow indicator) and I want to make it conditional on there being a list embeded in another list and I would like to use css and not php or javascript. Is this possible?

    Hi Mate,

    So I can understand it a little bit better do you just want to display another arrow once the content has been expanded?

    Thanks,

    Scott

  • #3
    New to the CF scene
    Join Date
    Feb 2012
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts
    I have an example here: http://www.512designcrew.com/ul_vertical.htm

    what i would like to do is add bg images to indicate if there is more content to be displayed, i.e under the locations and contact categories, based on the if there is an embedded ul in that category. I hope that makes it a little clearer. Thanks.

  • #4
    New Coder
    Join Date
    Feb 2012
    Posts
    25
    Thanks
    0
    Thanked 5 Times in 5 Posts
    Quote Originally Posted by 512designcrew View Post
    I have an example here: http://www.512designcrew.com/ul_vertical.htm

    what i would like to do is add bg images to indicate if there is more content to be displayed, i.e under the locations and contact categories, based on the if there is an embedded ul in that category. I hope that makes it a little clearer. Thanks.
    Ok I think I'm getting there do you mean, if for instance you have following navigation:

    Home
    Services
    Products
    Contact

    And under the products heading you had

    Football
    Golf
    Rugby
    Cricket

    If one of the above sub categories had another category you would want an right arrow to illustrate there is more?

    Hope this makes sense?

    Thanks,

    Scott

  • #5
    New to the CF scene
    Join Date
    Feb 2012
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts
    exactly, can I do this with pure css? Or do I need to write out some code?

  • #6
    New Coder
    Join Date
    Feb 2012
    Posts
    25
    Thanks
    0
    Thanked 5 Times in 5 Posts
    Quote Originally Posted by 512designcrew View Post
    exactly, can I do this with pure css? Or do I need to write out some code?
    No you can do this in pure css you would have to use a pretty complex css navigation but you would be able to pull it off...

    i'll try and look for an example for you.

    Thanks,

    Scott

  • #7
    New to the CF scene
    Join Date
    Feb 2012
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thanks. You've been really helpful.

  • #8
    New Coder
    Join Date
    Feb 2012
    Posts
    25
    Thanks
    0
    Thanked 5 Times in 5 Posts
    Your probably best to start off with something like this:

    http://www.noupe.com/tutorial/drop-d...query-css.html

    P.S thank my posy ;-)
    Last edited by ScottBaxter; 02-13-2012 at 01:20 AM. Reason: Missed somthing...

  • Users who have thanked ScottBaxter for this post:

    512designcrew (02-13-2012)


  •  

    Posting Permissions

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