jay76 - Viewing Profile - Web Design Forum

View New Content

jay76's Profile User Rating:

Reputation: 3 Neutral

Group:: Members
Active Posts:: 232 (0.33 per day)
Joined:: 14-June 10
Profile Views:: 8,516
Last Active:: May 20 2012 05:07 PM
Currently:: Offline

My Information

Member Title:: Dedicated Member
Age:: Age Unknown
Birthday:: Birthday Unknown
Gender:: Not Telling

Contact Information

E-mail:: Private

Topics I've Started

horizontal aligned images with centered h2 tags above image

24 April 2012 - 09:19 PM

Hi,

hoping some can advise on this, I am trying to align 4 images horizontal on the page with h2 text tags about the images which will also be centered to the width of the image i.e. 150px

Having issues coding this, what is the easies way to code this so I have alt or title tags.

I am not an expert designer by any means but just looking for some pointers on this.

Thanks Jay
opacity color on hover over

25 February 2012 - 12:53 PM
Hi there,

I am adding opacity to some of my images, I want to add color on hover over... how do I achieve this?

I have tried color: .... background-color: but does not work?

Here is my css;
```
.fanbox2 img {
opacity:1.0;
filter:alpha(opacity=100); /* For IE8 and earlier */
}
.fanbox2 img:hover {
opacity:0.4;
filter:alpha(opacity=40); /* For IE8 and earlier */
}
```

sticky footer not working?

22 February 2012 - 10:26 PM

Hi guys and gals,

been having a prob with a sticky footer for a while and it is frustrating now, got this sticky footer off the net.

I have a big gap between the content and the footer but the demo version of this footer showed nothing like what I get.

My css is the following;

html,
body {
    font-family: Arial, Helvetica, sans-serif;
	margin:0;
	padding:0;
	height:100%;
}
#wrapper3 {
    width: 950px;
    text-align: left;
	position:relative;
	min-height:100%;
	margin: 0 auto;
	
	
	
}
#header3 {
	height: 60px;
	width: 950px;
	padding-top: 3px;
}
#content3 {
	padding-bottom:172px; /* Height of the footer element */
	width: 900px;
    text-align: left;
	margin: 0 auto;
}
#footer3 {
	background:#000000;
	width:100%;
	height:172px;
	position:relative;
	bottom:0;
	left:0;
}

any help much appreciated as it is driving me nuts I tells ya! lol

php contact form - adding honeytap / honeypot

20 February 2012 - 10:24 PM

Hi @ all,

managd to find a php contact form that I could follow, far from finished but I wanted to ask how I could add a honeytrap / honeypot to this contact form.

I also have a few alignment issues with the form i.e. the error messages do not go under the boxes to fill in and the your name suggestion e.g john smith , email address notes do not align up... please see enclosed image.

I enclose the contact.php file and the css file below;

<?php

// Set email variables
$email_to = 'add_your_email_address_here';
$email_subject = 'Contact Form';

// Set required fields
$required_fields = array('fullname','email','comment');

// set error messages
$error_messages = array(
	'fullname' => 'Please enter a Name to proceed.',
	'email' => 'Please enter a valid Email Address to continue.',
	'comment' => 'Please enter your Message to continue.'
);

// Set form status
$form_complete = FALSE;

// configure validation array
$validation = array();

// check form submittal
if(!empty($_POST)) {
	// Sanitise POST array
	foreach($_POST as $key => $value) $_POST[$key] = remove_email_injection(trim($value));
	
	// Loop into required fields and make sure they match our needs
	foreach($required_fields as $field) {		
		// the field has been submitted?
		if(!array_key_exists($field, $_POST)) array_push($validation, $field);
		
		// check there is information in the field?
		if($_POST[$field] == '') array_push($validation, $field);
		
		// validate the email address supplied
		if($field == 'email') if(!validate_email_address($_POST[$field])) array_push($validation, $field);
	}
	
	// basic validation result
	if(count($validation) == 0) {
		// Prepare our content string
		$email_content = 'Contact us Form: ' . "\n\n";
		
		// simple email content
		foreach($_POST as $key => $value) {
			if($key != 'submit') $email_content .= $key . ': ' . $value . "\n";
		}
		
		// if validation passed ok then send the email
		mail($email_to, $email_subject, $email_content);
		
		// Update form switch
		$form_complete = TRUE;
	}
}

function validate_email_address($email = FALSE) {
	return (preg_match('/^[^@\s]+@([-a-z0-9]+\.)+[a-z]{2,}$/i', $email))? TRUE : FALSE;
}

function remove_email_injection($field = FALSE) {
   return (str_ireplace(array("\r", "\n", "%0a", "%0d", "Content-Type:", "bcc:","to:","cc:"), '', $field));
}

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>



	<title>Contact Form</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	
	<link href="contact/css/contactform.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/mootools/1.3.0/mootools-yui-compressed.js"></script>
    <script type="text/javascript" src="validation/validation.js"></script>	
	<script type="text/javascript">
		var nameError = '<?php echo $error_messages['fullname']; ?>';
		var emailError = '<?php echo $error_messages['email']; ?>';
		var commentError = '<?php echo $error_messages['comment']; ?>';
	</script>

</head>

<body>
<div id="formWrap">
<h2>Contact us Form</h2>
<div id="form">
<?php if($form_complete === FALSE): ?>
<form action="contact.php" method="post" id="comments_form">
<div class="row">
<div class="label">Your Name</div><!-- end of .label class -->
<div class="input"></div>
<input type="text" id="fullname" class="detail" name="fullname" value="<?php echo isset($_POST['fullname'])? $_POST['fullname'] : ''; ?>"  /><?php if(in_array('fullname', $validation)): ?><span class="error"><?php echo $error_messages['fullname']; ?></span><?php endif; ?>
<!-- end of .input class -->
<div class="context">e.g John Smith or Jane Doe</div><!-- end of .context -->
</div><!-- end of .row class -->

<div class="row">
<div class="label">Your Email Address</div><!-- end of .label class -->
<div class="input"></div>
<input type="text" id="email" class="detail" name="email" value="<?php echo isset($_POST['email'])? $_POST['email'] : ''; ?>"  /><?php if(in_array('email', $validation)): ?><span class="error"><?php echo $error_messages['email']; ?></span><?php endif; ?>
<!-- end of .input class -->
<div class="context">We do not share your contact information with 3rd party's</div><!-- end of .context -->
</div><!-- end of .row class -->

<div class="row">
<div class="label">Your Message</div><!-- end of .label class -->
<div class="input">
<textarea id="comment" name="comment" class="mess"><?php echo isset($_POST['comment'])? $_POST['comment'] : ''; ?></textarea><?php if(in_array('comment', $validation)): ?><span class="error"><?php echo $error_messages['comment']; ?></span><?php endif; ?>
</div><!-- end of .input -->
</div><!-- enf of .row -->
<div class="submit">
<input type="submit" id="submit" name="submit" value="Send Message" />
</div><!-- end of .input class --><!-- end of .submit -->
</form>
<?php else: ?>
<p style="font-size:24px; font-family:Arial, Helvetica, sans-serif; color:#00C; margin-left:190px;">Thank you for your Message!</p>
<script type="text/javascript">
setTimeout('ourRedirect()', 4000)
function ourRedirect() {
	location.href='index.html'
}

</script>
<?php endif; ?>
</div>
</div>
<!-- end of form div -->
</div><!-- end of formWrap div -->

</body>
</html>

form css below;

body {
background:#E9E9E9;
}

#formWrap {
width:720px;
margin-top:30px;
margin-left:30px;
background:#fff;
border:1px solid #F1F1F1; -moz-border-radius:20px;
-moz-box-shadow:2px 2px 5px #999;
-webkit-border-radius:20px;
-webkit-box-shadow:2px 2px 5px #999;
padding:16px 10px 40px;
}

#formWrap #form {
border-top:1px solid #EEE;
width:720px;
}

#form .row {
border-bottom:1px dotted #EEE;
display:block;
line-height:38px;
overflow:auto;
padding:24px 0px;
width:100%;

}

#form .row .label {
font-size:14px;
font-weight:bold;
font-family:Arial, Helvetica, sans-serif;
width:180px;
text-align:right;
float:left;
padding-right:10px;
margin-right:10px;
margin-top:-12px;

}

.detail {
width:260px;
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
padding:7px 8px;
margin:0;
display:block;
}

.mess {
width:260px;
max-width:260px;
height:100px;
overflow:auto;
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
padding:7px 8px;
line-height:1em;
margin:0px;
display:block;
display:block;	
}

#form .row .input {
float:left;
margin-right:10px;
width:auto;
}

#form .row .context {
color:#999;
font-size:11px;
font-style:italic;
line-height:14px;
font-family:Arial, Helvetica, sans-serif;
width:200px;
float:right;
}

#form #submit {
font-family:Arial, Helvetica, sans-serif;
margin-top:25px;
margin-left:200px;
color:#000;
font-size:16px;
text-shadow:1px 1px 1px #999;
padding:10px;
}

span.error {
color:#F00;
display:block;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
background-image:url(../images/x.png);
background-repeat:no-repeat;
background-position:left 6px;
padding-left:25px;
}

#formWrap h2 {
font-family:Arial, Helvetica, sans-serif;
text-shadow:1px 1px 1px #CCC;
color:#03C;
margin-left:190px;	
}

please post if you can help, Jay

Footer layout - whitespace under footer

06 February 2012 - 12:15 PM

Hi, hopefully a simple footer issue that someone can help me on.

I have a footer that also has a footheader which is a shadow effect that sits above the footer, when I remove this footheader I get white space under the footer, how do I prevent the whitespace?

I have tried altering the .push but does not make any difference.

css code below;

.push    {              
	height: 328px;
	clear: both;
}

#footer    {           
    height:250px;
	background:#000;
	
   		
}
#footerline  {
    height:15px;
    background: gray;
    
}
#footerlinetxt {
    width:940px;
	margin: 0 auto;
}
#footerlinetxt p {
    font:arial;
	font-size:10px;
	text-align:left;
	margin-left:10px;
	color:#ffffff;
}
#footerheader {
	height: 78px;
	background-image: url(../images/footer-shadow.jpg);
	background-repeat: repeat-x;
	clear:both;
	
	
}

Web Design Forum: jay76 - Viewing Profile - Web Design Forum

WDF Marketplace

WDF Marketplace Resources

WDF Community

Web Design Resources

Web Development

SEO, Marketing & Business

Software & Hardware

The Marketplace

jay76's Profile User Rating:

My Information

Contact Information

Topics I've Started

horizontal aligned images with centered h2 tags above image

opacity color on hover over

sticky footer not working?

php contact form - adding honeytap / honeypot

Footer layout - whitespace under footer

Friends

Comments

Skin and Language

Execution Stats