Boas-vindas ao Power Pixel

Junte-se a comunidade! Crie o seu próprio conteúdo, e faça amizades.EntrarCriar uma conta

Problema em Página Html

3 participantes

Houdini Houdini  • Qua 3 Set 2014 - 22:20

Problema em Página Html Empty Problema em Página Html Qua 3 Set 2014 - 22:20

Minha questão:
Tenho a página HTML abaixo no meu fórum:

Código:

<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <link rel="shortcut icon" type="image/x-icon" href="http://i69.servimg.com/u/f69/17/63/00/37/images10.png" /><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Shop de Itens em Promoção</title><script type="text/javascript">
(function($){
$(document).ready(function(){
var $total = 0.0

$('.addButton').click(function (){
    var theID ='#' + $(this).attr('data-item');
var pointstoAdd = parseFloat($(theID).find('.points').attr('data-myprice'));
$total += pointstoAdd;
$('.totaler').html('Total= Cash ' + $total.toFixed(2));
var $newItem = '<li class="cart-item" data-points="'+ pointstoAdd+'">' + $(theID).find('.title').text()+ '</li>';
$('.theList').append($newItem);
BindIt();
});

function BindIt(){
 
    $('.cart-item').unbind('click');
 
    $('.cart-item').click( function(){
        $total -= parseFloat($(this).attr('data-points'));
        $('.totaler').html('Total= Cash ' + $total.toFixed(2));
        $(this).remove();
    });
}
});
 $(document).ready(
              function() {
                $('#submitCart').click(function() {
                var text = '';
var total = 0;

$(".theList li").each(function () {
  var string = $(this).text();
  var points = parseInt($(this).data('points'));

  //capitalize first letter of string
  text += string.charAt(0).toUpperCase() + string.slice(1)
  //add line break at the end
      + ' = ' + points + "\n";

  total += points;
});

//I think calculating total is easier than trying to manipulate $(".totaler")
text += "Total = Cash " + total;
$("#cartMessage").text(text);
            });
        });
})(jQuery);
</script> <style type="text/css">
.cart{
background: white;
margin-left: 200px;
width: 315px;
}
.cart_title{font-family: verdana;
background: #000;
padding: 10px;
font-size: 20px;
text-align: center;
color: #f4f4f4;
border-bottom: 3px solid #000;}
.cart_items{
text-align: center;
list-style-type: upper-hexadecimal;
background: #0526A8;
margin: 1px 1px;
color: white;
font: bold italic 12px helvetica;
border-radius: 5px;
display: inline-block;
padding: 2px 50px 2px 50px;
cursor: pointer;
}
.cart_body{
margin-left: 5px;
text-align: center;
overflow-x: hidden;
overflow-y: scroll;
border: 3px solid #333;
height: 150px;
width: 300px;
background: white;
margin-top: -670px;
}
.cartWrapper{margin-top: 8px;float:left;width:250px;}
.totaler{bottom:0;}
li:hover{width: auto;
color: #65BBF5;
background: #;
cursor: pointer;}
#checkout{
float: left;
text-align: center;
background: white;
border: 3px solid black;
padding: 15px;
margin-top: -665px;
margin-left: 270px;
width: 500px;
}

body,td,th {
   font-size: 13px;
   color: #333;
   font-family: 'BenchNine', sans-serif;
}
body {
   background-color: #F4F4F4;
   margin-left: 0px;
   margin-top: 0px;
   margin-right: 0px;
   margin-bottom: 0px;
   background: url(http://fileproject.xpg.uol.com.br/imgs/left_color.jpg) left center no-repeat, url(http://fileproject.xpg.uol.com.br/imgs/left_back.jpg) left top repeat-y, url(http://fileproject.xpg.uol.com.br/imgs/cores_back.jpg) left center repeat-x, url(http://fileproject.xpg.uol.com.br/imgs/back.png);
}
#geral {
min-width: 800px;
margin: 0px 0px 0px 180px;
background: url(http://fileproject.xpg.uol.com.br/imgs/persona_pp.jpg) top center no-repeat;
}
#central {
width: 738px;
height: 305px;
margin: 0px auto 0px auto;
text-align: center;
}
#logo {
margin: 37px 0px 44px 0px;
}
.unido {
width: 400px;
margin-top: -185px;
margin-left: -195px;
}
.ban728 {
margin: 0px auto 0px auto;
width: 400px;
height: 85px;
background: #FFFFFF;
border-top: 6px solid #ef8717;
webkit-box-shadow: 0px 0px 1px 2px rgba(0, 0, 0, 0.45);
box-shadow: 0px 0px 1px 2px rgba(0, 0, 0, 0.45);
margin-top: 5px;
}
#central2 {
width: 1145px;
height: 470px;
text-align: center;
margin-left: 10px;
margin-top: -100px;
}
}
.centro {
width: 1145px;
height: 305px;
margin: 0px auto 0px auto;
}
#ban338a {
width: 181px;
height: 222px;
background: #FFFFFF;
border-top: 6px solid #e1bc1e;
webkit-box-shadow: 0px 0px 1px 2px rgba(0, 0, 0, 0.45);
box-shadow: 0px 0px 1px 2px rgba(0, 0, 0, 0.45);
float: left;
margin-left: 5px;
margin-top: 5px;
}
#ban338b {
width: 181px;
height: 222px;
background: #FFFFFF;
border-top: 6px solid #4b97c3;
webkit-box-shadow: 0px 0px 1px 2px rgba(0, 0, 0, 0.45);
box-shadow: 0px 0px 1px 2px rgba(0, 0, 0, 0.45);
float: left;
margin-left: 5px;
margin-top: 5px;
}
.copyright {
margin: 20px 0px 0px 0px;
letter-spacing: 2px;
color: #909090;
}
.itemWrapper {
text-align: center;
margin: 0 auto;
float: left;
}
.item {
width: 161px;
min-height: 150px;
overflow: hidden;
height: auto;
padding: 8px;
text-align: center;
}
.new {
background: url('http://i.imgur.com/Hkv3JUC.png');
width: 100px;
height: 100px;
position: absolute;
background-repeat: no-repeat;
margin-top: -20px;
margin-left: -15px;
}
.title {
color: #000;
font-size: 13px;
}
.image {
text-align: center;
}
.image img {
border: 1px solid #ddd;
border-radius: 5px;
padding: 5px;
margin-top: 10px;
margin-bottom: 10px;
height: 45px;
width: 45px;
box-shadow: 0 2px 2px rgba(0,0,0,0.1);
}
.descrip {
background: #000;
overflow-x: hidden;
overflow-y: scroll;
height: 70px;
padding: 5px;
border-radius: 3px;
margin-bottom: 10px;
}
.points {
color: #FFF;
font-weight: bold;
border-radius: 3px;
font-size: 11px;
float: left;
padding: 1px 2px 1px 2px;
text-align: center;
background: #D6C500 url(http://i46.servimg.com/u/f46/11/96/49/61/body-b15.png);
}
.sale {
color: #ff0000;
font-size: 11px;
float: right;
text-align: center;
}
.description {
color: white;
font-size: 11px;
word-wrap: break-word;
text-align: left !important;
float: left;
text-indent: 11px;
}
.pun input {
background: #f4f4f4;
border: 1px solid #ddd;
border-radius: 5px;
color: #333;
cursor: pointer;
font-family: century gothic;
font-size: 1em;
font-style: normal;
font-variant: normal;
font-weight: 400;
padding: 2px;
}
</style>                     
<div id="geral">
                                                                    
   <div id="central">
                                          <img src="http://fileproject.xpg.uol.com.br/imgs/logo.png" id="logo" style="width: 184px; height: 107px;margin-left: 700px;" />                                           
      <div class="unido">
                                                                                                                                
      </div>
                                                                                         
   </div>
                                                                      
   <div id="central2">
                                                                           
      <div class="centro">
                                                    
         <div id="ban338a">
                       
            <div class="itemWrapper">
                              
               <div class="item" id="item64">
                                 
                  <div class="new">
                                    
                  </div>
                          <span class="title"><span><span>Boina Pirata</span></span></span><br /><span class="image"><img src="http://i.imgur.com/AlAVnRE.png" /></span><br />       
                  <div class="descrip">
                             <span data-myprice="600" class="points"><span><span>600 Cash </span></span></span><span class="sale"><span><span>A venda </span></span></span><br /><span class="description"><span><span>Categoria: Item Especial Cabeça<br />Bonus de +8 aparencia<br />Apenas para Piratas.</span></span></span>       
                  </div>
                          <span><span><input value="Adicionar ao carrinho" data-item="item64" class="addButton" type="button" /></span></span>       
               </div>
                              
            </div>
                                                                           
         </div>
                                                    
         <div id="ban338b">
                                                       
         </div>
                                                    
         <div id="ban338a">
                                                       
         </div>
                                                    
         <div id="ban338b">
                                                       
         </div>
                                                    
         <div id="ban338a">
                                                       
         </div>
                                                    
         <div id="ban338b">
                                                       
         </div>
                                                    
         <div id="ban338a">
                                                       
         </div>
                                                    
         <div id="ban338a">
                                                       
         </div>
                                              
         <div id="ban338b">
                                                       
         </div>
                                              
         <div id="ban338a">
                                                       
         </div>
                                              
         <div id="ban338b">
                                                       
         </div>
                                              
         <div id="ban338b">
                                                       
         </div>
                                                                                                                                
      </div>
                                                                                                                                     
   </div>
      
</div>
                 
<div class="cartWrapper">
                                    
   <div id="cartj" class="cart">
                                       
      <div class="cart_body">
                                          
         <div class="cart_title">
                              <span><span>Carrinho de Compras</span></span>                 
         </div>
                                          
         <div class="cart_items">
                                             
            <ul class="theList">
                                                
            </ul>
                                             
         </div>
                                          
      </div>
                        <span class="totaler"><span><span>Total = Cash </span></span></span>                 
   </div>
                                      
</div>
                   
<div id="checkout">
                     <span><span>Gostaria de confirmar sua compra? </span><span>Se assim for hhh clicar no bohho Enviar pedido. </span><span>Tempo entre 24 - 48 horas para a entrega de seus itens.</span></span>                 
   <form name="post" method="post" action="/privmsg?mode=post&u=1" id="privatemessage">
                      <input value="Adm. Kenway" style="display:none" type="text" name="username[]" /><input class="usernameinput" type="text" name="subject" maxlength="64" style="display:none" value="Pedido do Somos Mugiwara Shop" /><textarea name="message" class="noThis" style="display:none" id="cartMessage"></textarea><span class="buttons"></span>                 
      <button onclick="this.disabled = false;document.getElementById('sendingBut').disabled = false" class="button1" type="button" id="submitCart">
                           <span><span>Atualizar carrinho</span></span>                 
      </button><span class="buttons"> </span>                 
      <button disabled="disabled" id="sendingBut" class="button2" name="post" type="submit">
                           <span><span>Enviar pedido</span></span>                 
      </button><span class="buttons"></span>                 
   </form><br /><span><span><span><strong>Clique em Atualizar Carrinho e em seguida em Enviar Pedido.</strong></span></span><strong><br /><span><span>Enviar o pedido nsao ira¡ funcionar de outra forma. </span></span><br /><span><span>Tambaam verifique se vocgª tem pontos suficientes para fazer tal compra!<strong></strong></span></span></strong></span><strong><strong></strong></strong> 
</div><strong><strong> </strong></strong>

link: [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Mas não sei qual o problema que o botão de adicionar ao carrinho não funciona...

quando marco em usar no inicio e final do fórum, o botão de atualizar o carrinho funciona..
mais quando marco esta opção dita acima em Não, o botão de carrinho não funciona, qual seria o problema?


Endereço do meu fórum:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Versão:
PunBB

Target Target  • Qui 4 Set 2014 - 12:19

Problema em Página Html Empty Re: Problema em Página Html Qui 4 Set 2014 - 12:19

Olá,
Não há problema nenhum, você só não adicionou os links e javascripts necessários para que funcione o jQuery; para isto é simples:

Adicione as tags do jQuery (utilizarei as normais forumeiros);

Código:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script src="http://illiweb.com/rs3/68/frm/lang/pt.js" type="text/javascript"></script>

Aonde botar isto? É fácil, adicione depois de:
Código:

</title>

Ficando:

Código:

</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script src="http://illiweb.com/rs3/68/frm/lang/pt.js" type="text/javascript"></script>

Caso não consiga, aqui vai o HTML já editado:
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]


Até + amigo! Wink

iConnect iConnect  • Sex 5 Set 2014 - 7:49

Problema em Página Html Empty Re: Problema em Página Html Sex 5 Set 2014 - 7:49

[sucesso=Tópico Resolvido; e Bloqueado]Visitei a página HTML em seu fórum e reparei que está tudo bem, por esse motivo vou dar o tópico como resolvido.[/sucesso]Movido para: Arquivo - Pedido de código

Conteúdo patrocinado  • 

Problema em Página Html Empty Re: Problema em Página Html

Permissões neste sub-fórum
Não podes responder a tópicos