-2

I want to do the following:

  1. Press menu link called "Contacts" - Done
  2. Create a footer with Email, Rights & Contacts - Done
  3. After press "Contacts" (menu), all page becomes white and Email, Rights & Contacts stay on middle (jQuery maybe?)

Is this possible?

I don't want to create a page with contact forms, just for this. I should just continue my index.html page with #contacts on bottom, and use Parallax or FullPage.JS?

See the page & code: www.wemadeyou.pt

Alvaro
  • 37,936
  • 23
  • 138
  • 304
uniqezor
  • 169
  • 1
  • 6
  • 17

1 Answers1

1

Yes this is possible and not very difficult. One way you can do it make a div on the page and use css display: none to hide the div. Then use jQuery to show that div when the 'Contacts' menu button is clicked.

Something like:

Html: 

<body>
  <p>Here is some content</p>

  <div class="contact-form-container">
    <form class="contact-form">
    <!-- put your contact form here -->
    </form>
  </div>

</body>

CSS:

.contact-form-container {
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.25);
  z-index: 200;
}

JS (jquery):

$(document).ready(function() {
  $('.contacts').click(function(e) {  //or whatever the class/id of your menu button is
    e.preventDefault();
    $('.contact-form-container').toggle();
  }
}

This will get you most of the way there. You will still have to handle the form of course.

Hope that helps.

BigHeadCreations
  • 1,257
  • 3
  • 13
  • 29
  • I'm a bit confused. I understood the JS & CSS but I didn't understand why I should use a
    .
     – uniqezor Mar 31 '14 at 20:18
  • @uniqezor I think I misunderstood your question. I thought you wanted to show a contact form on the index.html page after pressing 'contacts' in the menu. If you just want to show contact information in the popup after pressing 'contacts' in the menu, then you don't need a
    .
     – BigHeadCreations Apr 02 '14 at 05:08
  • My footer has the information / contacts I want to display. Maybe I wasn't clear. – uniqezor Apr 02 '14 at 16:34
  • I want my footer background & div that are there, to fill my page with white background, with CSS3 transition, with the content I already have on that
    – uniqezor Apr 02 '14 at 16:35