[Dự án] Shop Auto chọn nhiều pet

  Bài viết hay nhất1
First topic message reminder :

Shop auto chọn nhiều pet © FCAmusement - VnIcefox 2014
Thiết kế: Méo Hắc Hắc (NCat) - K.
Cùng với sự giúp đỡ đắc lực của Zzbaivong - Devs.cf
Hàng mẫu, có thể lỗi nhiều
Tuyệt đối không xóa phần copyright bên dưới shop

Thông tin cập nhật code:
Chuyển từ nhiều gian hàng sang gian hàng dạng tab
Khi chọn xong có thể click thêm một lần nữa để bỏ hàng đang chọn
Hiện số hàng đang chọn ở Giỏ Hàng
Khi chưa chọn hàng sẽ không thể click vào nút gửi hóa đơn
Khung thông tin vẫn bao gồm tên, tiền và bài gửi
Sau khi chọn xong thì click vào nút gửi hóa đơn màu tím
Nói chung là như thế :v
Demo: http://fcatest6.forumvi.com/h2-page


Code:
Tạo HTML : Do you wish to use your forum header and footer ? >> Có
Code:
<br/><div class="caigiday"><center><span style="font-size: 25px;font-weight: bold;color: #fff;">SHOP NÈ HÁ HÁ HÁ</span></center></div><br/>
<table border="0" style="width:100%">
  <tr>
    <td style="width:570px" valign="top">
      <div class="chonpet">
        <div class="tabbed_area">
       <ul class="tabs">
            <li><a href="#1" title="content_1" class="tab active">EMO MÉO 1</a></li>
            <li><a href="#2" title="content_2" class="tab">EMO MÉO 2</a></li>
        </ul>
       
        <div id="content_1" class="content">
            <div class="gianhang">
          <label>
            <input type="checkbox" name="item" class="item" />
            <img alt="item" src="http://i.imgur.com/peNYpHh.jpg" />
        </label>
        <label>
            <input type="checkbox" name="item" class="item" />
            <img alt="item" src="http://i.imgur.com/aUAn9JZ.jpg" />
        </label>
        <label>
            <input type="checkbox" name="item" class="item" />
            <img alt="item" src="http://i.imgur.com/TDIdQFQ.jpg" />
        </label>
        <label>
            <input type="checkbox" name="item" class="item" />
            <img alt="item" src="http://i.imgur.com/pjwIkFz.jpg" />
        </label>
     </div>
        </div>
        <div id="content_2" class="content">
            <div class="gianhang">
          <label>
            <input type="checkbox" name="item" class="item" />
      <img src="http://i.imgur.com/KSEvDV3.jpg"/>
          </label>
          <label>
            <input type="checkbox" name="item" class="item" />
      <img src="http://i.imgur.com/dI9F4RA.jpg"/>
          </label>
          <label>
            <input type="checkbox" name="item" class="item" />
      <img src="http://i.imgur.com/qKhd9RU.jpg"/>
          </label>
          <label>
            <input type="checkbox" name="item" class="item" />
      <img src="http://i.imgur.com/VGX73kB.jpg"/>
          </label>
          <label>
            <input type="checkbox" name="item" class="item" />
      <img src="http://i.imgur.com/vbJMG79.jpg"/>
          </label>
     </div>
        </div>
   
    </div>
     
  </div>
      <div class="headne">COPYRIGHT</div>
    <div class="cprshop">
      Shop auto chọn nhiều pet © FCAmusement - VnIcefox 2014<br/>
Thiết kế: Méo Hắc Hắc (NCat) - K.<br/>
Cùng với sự giúp đỡ đắc lực của Zzbaivong - Devs.cf<br/>
Vui lòng không rip code dưới mọi hình thức</div></td><td valign="top">
  <div id="cart">
<div class="headxem">GIỎ HÀNG (<span class="num">0</span>)</div>
<div class="xempetne"></div>
    <div class="tongtien">Tổng tiền: 0 Points</div>
  </div>
<div class="headxem">THÔNG TIN</div>
<div class="thongtinkhach">
Tên khách hàng: <span class="USERLINK" id="namene"></span><br />
Tài khoản: <span class="mypoint"></span> Points<br/>
Bài gửi: <span class="USERCOUNTPOST"></span> Bài
</div>
<!-- BEGIN switch_user_logged_out --><div class="muapet">
   <form id="abc" action="/post" class="frm-form" method="post" name="post" enctype="multipart/form-data">
        <div class="main-content frm">
                <input id="tieudepet" style="display:none" type="text" name="subject" value="" maxlength="255" title="The length of the title for this topic must be ranging between 10 and 255 characters" onkeypress="if (event.keyCode==13){return false}" />
                <script type="text/javascript">
                  //<![CDATA[
                  input = document.getElementsByName('subject');//]]>
                </script>
             <!-- Edit Textarea -->
              <textarea id="text_editor_textarea" name="message" style="display:none"></textarea>
             <!-- Edit Textarea -->
              <input type="hidden" name="mode" value="newtopic" />
              <input type="hidden" name="f" value="7" />
              <input type="hidden" name="lt" value="0" />
              <input id="submit" type="submit" name="post" value="Gửi hóa đơn" tabindex="6" accesskey="s" />
        </div>   
   </form>
</div><!-- END switch_user_logged_out -->
  </td></tr></table>

<script>
  $(".mypoint").load($(".name a").attr("href") + " #field_id-13 .field_uneditable");
  $("#submit").click(function(){
  $("#tieudepet").val("Hóa đơn của " + $('span.USERLINK a').html());});
 
</script>
<style>
.cprshop {border: 2px solid #3C6432;padding: 17px 20px;color: #3C6432;font-weight: bold;background: #CFE2CA;}
.caigiday {background: #6CA05F;padding: 20px;text-align: center;}
button, input[type="submit"] {cursor:pointer;outline:none!important}
div.chonpet img {cursor:pointer;}
#submit {display:none;background: #A05F96;padding: 5px;border: 0;color: #fff;font-size: 16px;font-weight: bold;font-family: 'Roboto' , sans-serif;box-sizing: inherit;width: 100%;margin-left: -1px;margin-top: -1px;}
.muapet {margin-left: 10px;width: calc(90% + 6px);margin-top:10px}
div.xempetne img {width: 75px;padding: 7px;}
.gianhang {overflow-y: scroll;overflow-x: hidden!important;border: 2px solid #816E52;background: #C5B091;padding: 5px;height: 220px;}
.gianhang img {padding: 4px;}
.gianhang .item {display: none;}
.gianhang .item + img {box-shadow: 0 0 0px transparent;}
.gianhang .item:checked + img {box-shadow: 0 0 5px #000;}
.headxem {padding: 7px;background: cadetblue;color: #fff;font-weight: bold;margin-top:10px;width: 90%;background: cadetblue;color: #fff;font-weight: bold;margin-left: 10px;}
.headxem:first-child {margin-top:0}
div.xempetne {border: 2px solid cadetblue;border-top:0;padding: 5px;overflow-y: scroll;overflow-x: hidden!important;background: #C4DEDF;height: 221px;width: 90%;margin-left: 10px;}
.lamlaine {background: rgb(76, 125, 126);padding: 5px;border: 0;color: #fff;font-weight: bold;float: right;margin-top: -4px;font-size: 14px;}
.headne {padding: 7px 10px;color: #fff;background: #3C6432;font-weight: bold;margin-top: 10px;}
.mypoint .field_uneditable {display: inline-block;}
.thongtinkhach {padding: 5px;border: 2px solid cadetblue;margin-left: 10px;width: 90%;}

  /**/ 
#tabbed_box_1{margin:0 auto 0 auto;width:300px}
.tabbed_box h4{font-family:Arial,Helvetica,sans-serif;font-size:23px;color:#fff;letter-spacing:-1px;margin-bottom:10px}
.tabbed_box h4 small{color:#e3e9ec;font-weight:normal;font-size:9px;font-family:Verdana,Arial,Helvetica,sans-serif;text-transform:uppercase;position:relative;top:-4px;left:6px;letter-spacing:0}
ul.tabs {height: 31px;background: #A0865F;margin: 0;padding: 0;}
ul.tabs li:first-child a {margin-left: 10px;}
ul.tabs li {margin-top: 7px;list-style: none;display: inline-block;}
ul.tabs li a {background: #64543C;padding: 10px;font-size: 9px;font-weight: bold;color: #fff!important;font-family: 'Roboto', sans-serif;}
ul.tabs li a.active {background: #7C6B52;}
#content_2,#content_3,#content_4,#content_5,#content_6,#content_7,#content_8,#content_9,#content_10{display:none}
.content ul{margin:0;padding:0 20px}
.content ul li{list-style:none;border-bottom:1px solid #d6dde0;padding-top:15px;padding-bottom:15px;font-size:13px}
.content ul li:last-child{border-bottom:none}
.content ul li a{text-decoration:none;color:#3e4346}
.content ul li a small{color:#8b959c;font-size:9px;text-transform:uppercase;font-family:Verdana,Arial,Helvetica,sans-serif;position:relative;left:4px;top:0}
.content ul li a:hover{color:#a59c83}
.content ul li a:hover small{color:#baae8e}
.tongtien {padding: 5px 10px;margin-top: 10px;margin-left: 10px;border: 2px solid #A05F5F;color:#A05F5F}
</style>

<script>
$(".gianhang .item").change(function () {
$("div.xempetne").html($(".item:checked + img").clone());
$("#cart .num").text($(".item:checked + img").length);
var bill = "";
$("div.xempetne img").each(function(){
bill += "[img]" + this.src + "[/img]";
});
$("#text_editor_textarea").val(bill + '\n\n Tổng tiền: ' + $(".item:checked + img").length*100 + ' Points');
$(".item:checked").length ? $("#submit").fadeIn(250) : $("#submit").fadeOut(250);
});
</script>
<script>
$(document).ready(function(){
// Sự kiện khi nhấn vào các tab của menu
$("a.tab").click(function () {
// tắt tất cả các tab
$(".active").removeClass("active");
// bật tab đang click lên
$(this).addClass("active");
// tạo hiệu ứng trượt lên trên cho nội dung của tab đang click
$(".content").hide();
// Nếu là tab đầu tiên thì set hiệu ứng là trượt xuống dưới
var content_show = $(this).attr("title");
$("#"+content_show).show();
});
});

$(window).load(function(){
if (Number($(".mypoint .field_uneditable").text()) >100) {
}
else {
alert("Xin lỗi bạn cần ít nhất 100 $ để thực hiện các chức năng trong Shop");
location.href="/forum";
}
});
$(".gianhang .item").change(function () {
$(".tongtien").text('Tổng tiền: ' + $("div.xempetne img").length*100 + ' Points');
if($("div.xempetne img").length*100 > Number($(".mypoint .field_uneditable").text())){alert('Bạn không đủ tiền để mua hết vật phẩm đã chọn\nHãy chọn lại cho phù hợp túi tiền của bạn')}
else{}
});
</script>

Thay 7 bằng id box muốn gửi hóa đơn trong đoạn
Code:

<input type="hidden" name="f" value="7" />

Lưu ý: ai chưa gán Variable cho forum thì thêm đoạn này vào cuối HTML:
Code:
<script type="text/javascript" src="http://yourjavascript.com/156126353119/fmvar.js"></script>
  Bài viết hay nhất76
Cái này méo không biết
Cứ add thủ công đi :v
  Bài viết hay nhất77
@NCat wrote:Cái này méo không biết
Cứ add thủ công đi :v
Mình làm 4rum LMHT
Add thủ công 110 con lâu lắm -_-
The author of this message was banned from the forum - See the message
  Bài viết hay nhất79
Méo cho mình hỏi miếng, khi add mấy cái hiện bài viết, points, tên thành viên vô thì hiện ok mà sao phần "Tài khoản" nó lại bị xuống hàng dòm rất xấu :(

  Bài viết hay nhất80
Link đâu?
  Bài viết hay nhất81
http://gamepro.forum.st/h7-page

Đây
  Bài viết hay nhất82
Méo vào thêm số point thì không thấy bị :-s
  Bài viết hay nhất83
Răng mà sao mình thêm vô thì bị xún dòng nhẩy :v Méo xem hộ boom code có đúng ko, sợ bỏ trúng code quan trọng nên nó bị :(
  Bài viết hay nhất84
Đã nói là méo thêm số point vào nó không bị gì hết mà :v còn không thì dùng float:left là được
  Bài viết hay nhất85
Vẫn bị méo ơi. Thêm vô thì nó ra ntn

http://gamepro.forum.st/h7-page

Mình thử xóa js hiện point đi thì đc :v
  Bài viết hay nhất86
ý là dùng float left cho cái này này
Code:
.mypoint .field_uneditable
  Bài viết hay nhất87
Cảm ơn méo thông não :v đã làm đc nhưng giờ nó dính cục lại với nhau, thử thêm &nbsp; vào thì mất lung cái số point @@
  Bài viết hay nhất88
Tìm cái đoạn Points trong html, cái ở chỗ hiện points ấy, thay thành
Code:
&nbsp;Points
  Bài viết hay nhất89
Shop này tự cập nhập vào profile đc ko v. :-?
  Bài viết hay nhất90
Không, nếu cần thì bạn dùng shop tự cập nhật ấy (chỉ có điều không chọn nhiều vật phẩm cùng lúc được)
  Bài viết hay nhất91
SAo mình cho vào rồi má nó cứ báo lỗi không có tiền thế . Quản lý người dùng & Quản lý nhóm --- >Profiles của bạn cài đặt sao thế ?
  Bài viết hay nhất92
nếu mình muốn không có hiệu ứng trượt lên trượt xuống thì làm sao ạ ( nh vẫn giữ ng hiệu ứng bật tab)?

Cho mình làm phiền chút ạ, mình muốn thành viên có số bài post tương ứng click vào label pet tương ứng, vd: mình có pet 1, pet 2 pet 3, pet 4,... và thành viên 1, tv2 , tv3 , tv4,...
---- Thv 1 có số bài post 10 bài chỉ có thể click vào label pet 1, pet 2
----- Thv 2 có số bài post 30 bài chỉ có thể click vào label pet 1, 2, 3
---- thv 3,4 có số bài viết là 50 trở đi có thể click vào label pet 4,....
Như vậy, ko biết có được ko ạ
  Bài viết hay nhất93
You cannot reply to topics in this forum