Change "submit" buttons into text and have them appear/disappear

Discussion in 'HTML & Website Design' started by samslystone, Nov 27, 2011.

  1. #1
    Hello

    Having problems with the following...a client needs me to replicate this contact page:

    http://www.ravenrow.org/contact/

    In particular he wants the subscribe/unsubscribe to appear only when one enters text into the text field (as it does here).

    I have recently changed from using tables to div tags but this was the first website where I started to experiment with divs. Unfortunately therefore it is a mixture of tables and divs. But here is my page:

    http://www.rowingpresents.com/contact.html

    Can someone tell me what I need in my code to have to subscribe/unsubscribe appear and disappear as it does at ravenrow.org.

    Many thanks

    S
     
    samslystone, Nov 27, 2011 IP
  2. Toycel

    Toycel Peon

    Messages:
    243
    Likes Received:
    11
    Best Answers:
    4
    Trophy Points:
    0
    #2
    They are using a Javascript onclick event to draw the button out when you enter some text into the box. Try googling the onClick event for JS and you can use it in some nice ways
     
    Toycel, Nov 27, 2011 IP
  3. samslystone

    samslystone Greenhorn

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    11
    #3
    Thanks for your reply.

    However, still having problems. I have been using behaviours in Dreamweaver on other aspects of the site but simple can't work out how to do this one! Any ideas?

    Many thanks

    S
     
    samslystone, Nov 28, 2011 IP
  4. 7thand43rd

    7thand43rd Member

    Messages:
    84
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    43
    #4
    What I would do is use Javascript's 'onKeyUp' on the text field and have it check to see if any text has been entered, if it has been entered change the style of the button from 'display: none' to 'display: block'.

    Basically whenever a key is pressed, then let up, Javascript will check the field to see if any text has been entered, and if so it'll show the submit button, if not it won't.
     
    7thand43rd, Nov 28, 2011 IP