Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Galera estou precisando de um codigo q faça essa função
/applications/core/interface/imageproxy/imageproxy.php?img=http://www.dedetinseto.com.br/site/painel/imagens/lista.png&key=1622532c5a7c63c6bd3a8b03e4f3dd6671e8ab34ae8d4339a3c134da9b82d956" alt="lista.png" />
estou usando esse aki em java
$("#tbcor1 tr:odd").css("background-color", "#bbbbff");
mas naun fuciona....
$( '#tbcor1 tr:nth-child(odd)' ).css( "...", "..." );
oq significa esses pontinhos
.css( "...". "..." );
????????????
vejam como estou fazendo deve haver algo errado ?????
<script type="text/javascript">
$("#tbcor1 tr:odd").css("background-color", "#bbbbff");
</script>
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr class="btcor1">
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr class="btcor1">
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr class="btcor1">
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr class="btcor1">
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr class="btcor1">
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>:huh: o seu código óras...
$( '#tbcor1 tr:nth-child(odd)' ).css( "background-color", "#bbbbff" );
Ficou melhor?
O foco era trocar isso " #tbcor1 tr:odd " por isso " #tbcor1 tr:nth-child(odd) ". :thumbsup:
__________________________________________________
Agora que editou o tópico e postou o código. É realmente necessário fazer esse efeito com Javascript?
<head>
<style>
table tr:nth-child(odd) {
background-color: #bbbbff;
}
</style>
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr class="btcor1">
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr class="btcor1">
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr class="btcor1">
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr class="btcor1">
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr class="btcor1">
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>viu como eu fiz acima e naun da certo.... :(
:huh: ... ... ... melhor postar o código de como você tentou.
é isso mesmo deu certo, RNXN vlw ......
Que Deus ilumini seus caminhos....
Cara apareceu um erro agora veja como estou usando
table tr:nth-child(odd) {
background-color: #bbbbff;
}
table tr:nth-child(even){
background-color: #000000;
}
html
<% While Not rs.EOF AND x < rs.PageSize
x = x + 1
q = q + 1
%>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><%=rs("id_Produto")%></td>
<td> </td>
<td> </td>
</tr>
</table>
<%
'Movendo para o proximo registro
RS.MoveNext
Wend
%>
ele naun coloca as cores corretamente ....
tinha q ficar
1 azul
2 preto
3 azul
4 preto
veja o link>> http://www.dedetinseto.com.br/site/painel/produtos/teste.asp
Olá Lezão, beleza?
Utiliza jQuery e faça o seguinte:
<script>
$(function(){
$('table tr:odd').addClass('outracor');
})
</script>
E em CSS cria a classe:
.outracor { background: #ddd; }
Se isso não resolver, posta o código para que eu possa analisar. ok?
e qnd eu utilizo outra tabela pega a função nela tbm, ao invés de pegar a função apenas na tabela citada acima...
Eai Gabriel-Costa, blz vou postar como estou usando o seu post
<script>
$(function(){
$('table tr:odd').addClass('background:#bbbbff');
})
</script>
<tr class="table">
<td><%=rs("id_Produto")%></td>
<td> </td>
<td> </td>
</tr> <%
'Movendo para o proximo registro
RS.MoveNext
Wend
%>
</table>
oq eu estava usando em CSS esta postado acima....
Se for utilizar jQuery apenas para esta rotina, acho completamente desnecessário.
O uso do CSS3 seria elegante, mas existe o problemas com os IE's.
E já que está utilizando um laço de repetição, seria mais interessante utilizar uma classe específica para colorir a sua linha, bastando para isso adicionar um verificador a cada registro para então alternar os estilos.
Off. No seu loop é realmente necessário a repetição de toda a tabela em vez apenas da linha?
Att.
Você não precisa definir valores para os ímpares e pares. Somente um dos dois.
table tr {
background: rgb(0,0,255); // azul
}
table tr:nth-child(odd) {
background: #000; // preto
}
mas no Css qnd uso o codigo, posso usar apenas uma tabela se eu inseriri outra tabela para outras finalidades a função do codigo passa pra ela tbm....
Cara, dá uma class ou ID para cada tabela e aplica a regra.
aqui....
aqui >>>>> <tr class="table">
<td><%=rs("id_Produto")%></td>
<td> </td>
<td> </td>
</tr> <%
'Movendo para o proximo registro
RS.MoveNext
Wend
%>
</table>>
e qnd eu utilizo outra tabela pega a função nela tbm, ao invés de pegar a função apenas na tabela citada acima...
Eai Gabriel-Costa, beleza vou postar como estou usando o seu post
<script>
$(function(){
$('table tr:odd').addClass('background:#bbbbff');
})
</script>
<tr class="table">
<td><%=rs("id_Produto")%></td>
<td> </td>
<td> </td>
</tr> <%
'Movendo para o proximo registro
RS.MoveNext
Wend
%>
</table>
oq eu estava usando em CSS esta postado acima....
A sua funçaõ jQuery acima está errada.
Quando se utiliza o .addClass() estamos adicionando uma classe o elemento, portanto somente é aceirto nome de classes.
Como eu disse anteriormente, você pode acrescentar dentro do seu código CSS uma classe com as estilizações da linha que irá ficar mais clara ou escura.
E com o jQuery, você acrescenta em cada linha, de 2 em 2, essa classe, com a função:
<script>
$(function(){
$('table tr:odd')**.addClass('outracor');**
})
</script>
E sobre pegar em todas as outras tabelas, e só você criar uma classe ou id para a tabela que você quer que essa função seja executada, por exemplo:
HTML
<table id="teste">
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
</table>
e o JS fica:
<script>
$(function(){
$('table#teste tr:odd').addClass('outracor');
})
</script>
CSS
.outracor {
background-color: #ddd;
}<table class='table'>
<!-- código da primeira tabela -->
</table>
<table class='outra-table'>
<!-- código da segunda tabela -->
</table>
.table tr:nth-child(odd) {
background: #000;
color: #fff;
}
.outra-table tr:nth-child(odd) {
background: rgb(0,0,255);
color: #fff;
}
http://jsfiddle.net/rnxn/Vt9HG/1/
>
aqui....
aqui >>>>> <tr class="table">
<td><%=rs("id_Produto")%></td>
<td> </td>
<td> </td>
</tr> <%
'Movendo para o proximo registro
RS.MoveNext
Wend
%>
</table>
Então, se você já tem uma tabela com classe 'table', o que você precisa fazer para diferenciar ela das demais tabelas? Criar uma nova classe e atribuir a essa nova tabela, ou, um ID, para distinguir ela dessa que usa a classe 'table'.
É um dúvida bem básica, recomendo que leia sobre class, ID e seletores:
tenta você fazer colocando ( class ou id ) para identificar a função , naun roda fica a mesma coisa....
codigo completo
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css"> margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
tbcor1 tr:nth-child(odd) {
background-color: #bbbbff;
}
</style>
<head>
</head>
<body>'Efetuando a conexão com a base de dados criada -----------------------
Set conexao = Server.CreateObject("AdoDB.Connection")
conexao.provider="Microsoft.Jet.OLEDB.4.0"
conexao.connectionstring=Server.Mappath("bancodedados.mdb")
conexao.open
Set rs = Server.Createobject("ADODB.RECORDSET")
set rs.ActiveConnection = Conexao
rs.CursorType = 3
rs.PageSize = registros
sql = "SELECT * FROM Produtos Order By Produto"
rs.Open sql
If rs.EOF Then
Response.Write "<center><font face=Verdana size=2><b>Nenhum registro encontrado!</b><br><br><a href=javascript:history.back(-1)><font face=Verdana, Arial, Helvetica, sans-serif size=1>Voltar</font></a> </center></font>"
Else
rs.AbsolutePage = pagina
%>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<% While Not rs.EOF AND x < rs.PageSize
x = x + 1
q = q + 1
%>
<tr class="tbcor1">
<td><%=rs("id_Produto")%></td>
<td> </td>
<td> </td>
</tr>
<%
'Movendo para o proximo registro
RS.MoveNext
Wend
%>
</table>
<%
anterior = pagina - 1
proxima = pagina + 1
ultima = rs.PageCount
primeira = 1
ultm2 = FormatNumber(rs.PageCount - 1,0)
If pagina <> 1 Then
Response.Write "<b> <a href=teste.asp?pagina="&primeira&">« Anterior</a></b> "
End If
If pagina > 1 AND pagina <> 2 Then
Response.Write " <b>[ <a href=teste.asp?pagina="&anterior - 1&">"&anterior - 1&"</a> ]</b> "
End If
If pagina > 1 Then
Response.Write "<b>[ <a href=teste.asp?pagina="&anterior&">"&anterior&"</a> ]</b> "
End If
Response.Write "<b>[ "&pagina&" ]</b> "
If Not rs.EOF Then
Response.Write "<b>[ <a href=teste.asp?pagina="&proxima&">"&proxima&"</a> ]</b> "
End If
If Not rs.EOF AND pagina <> ultima AND pagina <> ultm2 Then
Response.Write "<b>[ <a href=teste.asp?pagina="&proxima + 1&">"&proxima + 1&"</a> ]</b> "
End If
If Not rs.EOF Then
Response.Write "<b><a href=teste.asp?pagina="&ultima&">Próxima »</a> </b> "
End If
rs.Close
Set rs = Nothing
End If %>
</body>
</html>
tente fazer rodar usando este codigo ......
Lezão,
Olha ai o tutorial que eu fiz para te mostrar a função funcionando.
http://www.tutorialwebdesign.com.br/jquery-criar-efeito-zebra-em-tabelas/
Dá uma olhada e testa, ok?
Valeu!
Gabriel fiz o teste e naun rodou, poder ser meu pc q naun esta rodando só pode copiei e colei seus codigo do site e naun rodou
veja http://www.dedetinseto.com.br/site/painel/produtos/teste2.asp
naun rodou nada !!!!! =L
Só uma pergunta Lezão.
Você está chamando o jQuery lá no header do seu site?
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
No exemplo que você colocou ai, não esta presente o código acima.
Você precisa chamar a biblioteca jQuery para funcionar o código.
Confere ai.
É o seu código que está errado :unsure: . Veja seu HTML:
<tr class="tbcor1">
"tbcor1" está sendo aplicado em um elemento <tr>. Agora veja o seu CSS:
tbcor1 tr:nth-child(odd) {
background-color: #bbbbff;
}
Você quer que os filhos pares de <tr> **dentro** de .tbcor1( que é uma <tr> ) tenham essa regra. Mas, dentro de ".tbcor1" não tem nenhum <tr>. Veja:
<tr class="tbcor1">
<td><%=rs("id_Produto")%></td> <!-- <tr??? -->
<td> </td> <!-- <tr??? -->
<td> </td> <!-- <tr??? -->
</tr>
Por isso não funciona, simples. A minha sugestão foi que você aplicasse NA TABELA, sem mexer no corpo dela.
<head>
<style>
.minha-tabela tr:nth-child(odd) {
background: #bbbbff;
}
</style>
</head>
<body>
<!-- seu código -->
<table class='minha-tabela' width="100%" border="0" cellspacing="0" cellpadding="0">
<% While Not rs.EOF AND x < rs.PageSize
x = x + 1
q = q + 1
%>
<tr>
<td><%=rs("id_Produto")%></td>
<td> </td>
<td> </td>
</tr>
</table>
<!-- seu código -->
</body>
Agora, você quem sabe, se acha que é realmente necessário fazer uso de javascript (de um plugin) somente para colorir as linhas de uma tabela... bom, você quem sabe.
:thumbsup:
se for usar php
<style>
tr{ backgound-color:cor1; }
</style>
<?php
$style = 1;
while($tabela = $table->fetch_assoc()){ ?>
<tr style=<?=$style?>> Linha da tabela</tr>
<?php
$style = "background-color:cor2";
} ?>Gabriel-Costa vlw deu certo agora... ficou como eu precisava!!!!!
Crie uma classe para a tr e adicione uma cor de fundo.