Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript Display elements by hovering/clicking link … Help!

  • This topic is empty.
Viewing 15 posts - 1 through 15 (of 17 total)
  • Author
    Posts
  • #38442
    JosiahB
    Member

    I would like it so when the link is hovered over the “hidencontent” is displayed and when the mouse moves off it disappears, and when it is click on “hidencontent” would appear until ANYWHERE on the page is clicked (except for the “hidencontent” div and “morehidencontent” div) …
    here is the code I have but it does not work like I would like … oh and I do have the css code that already has the display to none on the hiden and morehidencontent but is not included …

    hover/click over me!

    Lots of interesting information … hover/click over me for more information!

    Even more interesting information!

    #109827
    zonger
    Member

    I don’t think you are supposed to “onclick” an ID. It should be some javascript function.

    #109849
    JosiahB
    Member

    well I know very little javascript and any help on how to accomplish what I was asking would be appreciated … :)

    #109912
    zonger
    Member
    #109913
    JosiahB
    Member

    that’s sorta what I am looking for but … I would like for the element to TEMPORARILY be displayed when hovered over (it disappears when the link is not being hovered over) and when it is clicked on for it to stay visible until ANYWHERE on the page is clicked (other the the #hidentcontent and #morehidencontent divs) or the link is then clicked again

    #109921
    amoss
    Participant
    #109995
    JosiahB
    Member

    I think this is what I am looking for … but I can not seem to get it to work when I write up the html/css … maybe you could just put it in the form that will work right off of my desktop …

    Thanks so much for your help so far! :D

    #110015
    amoss
    Participant

    What form would that be?

    #110017
    JosiahB
    Member

    ohh I am sorry I did not communicate that very well … hahaha Let me try again in English … when I copy out the individual sections and insert them into an html file the code does not work right … this is what I did …


    hover/click over me for more information!

    Even more interesting information!




    #110019
    JosiahB
    Member

    Okay … this whole markdown thing is not working for me …. soo here is a link to what I am talking about :) http://bible.comze.com/popup.html

    #110020
    amoss
    Participant

    I’m seeing a few of these characters ​

    ​collapsed:hover:after{
    content: “Lots of interesting information!”;
    display: block;
    }

    .collapsed2:hover:after{
    content: “Even more interesting information!”;
    display: block;
    }​

    should be

    .collapsed:hover:after{
    content: “Lots of interesting information!”;
    display: block;
    }

    .collapsed2:hover:after{
    content: “Even more interesting information!”;
    display: block;
    }

    #110021
    JosiahB
    Member

    ok inserted that … but has not seemed to fix anything …

    #110022
    JosiahB
    Member

    ok sorta got it now … but still have one ​

    #110023
    amoss
    Participant

    Even more interesting information!

    ​

    #110024
    JosiahB
    Member

    ok … just realized that this is not going to work … I need a very universal code where I can easily add countless popouts all over the place … and not have to use the css to add in content by creating all different kind of div names …

Viewing 15 posts - 1 through 15 (of 17 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.