P30-ART


ارسال موضوع ارسال پاسخ
 
امتیاز موضوع:
  • 1 رأی - میانگین امتیازات: 5
  • 1
  • 2
  • 3
  • 4
  • 5
قالب زیبای تماس با مدیریت+نمایش آنلاین
نویسنده پیام
مدیر کل انجمن
********

ارسال‌ها: 634
تاریخ عضویت: اسفند 1392
اعتبار: 77
وضعیت : آفلاین
جنسیت:
سپاس ها 782
سپاس شده 1165 بار در 473 ارسال
ارسال: #1
قالب زیبای تماس با مدیریت+نمایش آنلاین
سلام در ادامه قالب هایی که ار دیروز ترجمه و ویرایش کردم یه قالب تماس با مدیریت رو ارائه میدم 
فکر می کنم زیبایی و ارزش استفاده رو داشته باشه

[تصویر:  demo.png]
کد قالب:




کد:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>فرم تماس با مدیریت</title>
<meta name="description" content="">
<meta name="author" content="">

<!-- Le styles -->
<link href="http://bistbaner.ir/uploud/theme/taxiform/css/style.css" rel="stylesheet">

<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="http://bistbaner.ir/uploud/theme/taxiform/js/html5shiv.js"></script>
<![endif]-->

<!-- jQuery -->
<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>

<!-- Javascript -->
<script src="http://bistbaner.ir/uploud/theme/taxiform/js/jquery.placeholder.js"></script>
<script src="http://bistbaner.ir/uploud/theme/taxiform/js/custom.js"></script>

<!-- Fav and touch icons -->
<link rel="shortcut icon" href="http://bistbaner.ir/uploud/theme/taxiform/images/favicon.ico">
</head>

<body>

<div class="background">
<div class="wrapper">
<header>
<div class="tel"><span>123-456-789</span> :شماره تماس</div>
<div class="social">
<a href="#"><img src="http://bistbaner.ir/uploud/theme/taxiform/images/facebook.png" alt="" /></a>
<a href="#"><img src="http://bistbaner.ir/uploud/theme/taxiform/images/twitter.png" alt="" /></a>
</div>
</header>

<div class="sidebar">

<div class="order-form">
<div class="order-form-head">
<h1>فرم تماس با مدیریت</h1>
</div>
<div class="taxi-line"></div>

<!-- Contact Form -->
<form role="form" class="ajax-form">
<div class="inp"><input type="text" class="required" name="name" id="name" placeholder="نام کامل شما" /></div>
<div class="inp"><input type="text" class="required" name="tel" id="tel" placeholder="تلفن تماس" /></div>
<div class="inp"><input type="text" class="required" name="email" id="email" placeholder="ایمیل" /></div>
<div class="inp"><input type="text" class="required" name="time" id="time" placeholder="مکان" /></div>
<div class="inp"><input type="text" class="required" name="street" id="street" placeholder="موضوع" /></div>
<div class="inp"><textarea class="required" name="note" id="note" placeholder="پیام خود را بنویسید"></textarea></div>
<button type="submit"></button>
<div class="spacer"></div>
</form>

<script type="text/javascript">
$(document).ready(function(){

var loader = "images/loader.gif";

$('button[type="submit"]').on('click', function(e){
e.preventDefault();

var errors = 0;
var alert = $('.alert');
var $form = $('form.ajax-form');

alert.hide();

$.each($('.required'), function(){
var $that = $(this);
if($that.val() == ''){
$that.addClass('validation_error').parent().append("<div class='alert-no'></div><div class='alert alert-danger'>This field is required.</div>");
errors++;
}
});

if(errors > 0){
return false;
} else {
var serialized = $form.serialize();
serialized = serialized + "&ajax=1";
$form.html("<img src='" + loader + "' class='loader' />");
$.post('', serialized, function(data){
$('.loader').fadeOut("slow", function(){
var obj = jQuery.parseJSON(data);
$form.html(obj.msg);
});
});
}
});
});
</script> </div>

<div class="address-box">
<img src="http://bistbaner.ir/uploud/theme/taxiform/images/icon.png" class="icon" alt="" />
<div class="text">
<span>فرم تماس با ما</span><br />
info@test.com<br />
ایران- تهران<br />

</div>
</div>

</div>

<div class="character">
<img src="http://bistbaner.ir/uploud/theme/taxiform/images/taxi-driver.png" class="taxi-driver" alt="" />
</div>

<div class="spacer"></div>

<footer>
<p><strong>Order Taxi Theme</strong> &copy; All Rights Reserved.editing by the <a href="http://bistbaner.ir">bistbaner.ir</a></p>
</footer>
</div>
</div>

</body>
</html>


 

 

12-13-1392 12:59 ق.ظ
یافتن تمامی ارسال‌های این کاربر نقل قول این ارسال در یک پاسخ
ارسال موضوع ارسال پاسخ


پرش به انجمن:


کاربرانِ درحال بازدید از این موضوع: 1 مهمان