Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Boa tarde Pessoal,
Sou novato aqui e necessito de ajuda urgente para um código de JS.
O que acontece:
Tenho um objeto que quando sobreposto com outro objeto, precise que crie um bullet (•) na mesma div desde objeto (Ou seja, preciso fazer algo parecido com "if (objetos > 1) { $(this).append("<br>•") e, após isso, seja possível trocar do primeiro para o segundo objeto clicando nele ou utilizando swap, afetando também os bullets (tirando e removendo as classes).
Tenho os seguintes códigos:
Ao largar o objeto onde quero =>
function drop(ev) {
ev.preventDefault();
$("#project-description").remove();
$("#project").val("");
var data = ev.dataTransfer.getData("text\html");
var element = $(document.getElementById(data));
var target = $(ev.target).closest(".produto");
var project;
for (var i = 0; i < projects.length; i++)
if (projects[i].value == data)
project = projects[i];
if (project.video) {
$(target).append(project.video);
element.remove();
}
else if (element[0].tagName == "IMG") {
if (!$(':first-child',target).hasClass('ativo')) {
target.empty();
$("<div>").addClass("ativo").appendTo(target);
}
$(".ativo",target).prepend(element);
AtivaSlide($("body"));
}
}O que tenho até agora para a sobreposição =>
function AtivaSlide(container) {
if (container.ativos)
for (var i = 0; i < container.ativos.length; i++)
clearInterval(container.ativos[i]);
container.ativos = [];
$(".ativo", container).each(function() {
var $this = $(this);
if ($this.children().length > 1) {
$("img:gt(0)", $this).hide();
onclick(function() {
$(':first-child', $this)
.hide()
.next("img")
.end()
.appendTo($this);
});
}
});
}>
Olá, Loki.
Manda o HTML, para gente dar uma olhada?
[]'s
Marco Bruno.
Marco,
Segue abaixo:
<body>
<div class="cabecalho">
<div class="logo">
<img src="img/logo247.gif" title="24\7 Inteligência Digital" />
</div>
<h1>RETAIL ONLINE</h1><p> </p><p> </p>
</div>
<div class="corpo">
<div class="pagina">
<div class="topotabela">
<div class="textotopo"> COBRIMOS QUALQUER OFERTA NA BOCA DO CAIXA! </div>
</div>
<div class="restotabela">
<table id="conteudoCen">
<tr class="tabelalinha">
<td class="produto" ondrop="drop(event)" ondragover="allowDrop(event)">
</td>
<td class="produto" ondrop="drop(event)" ondragover="allowDrop(event)">
</td>
<td class="produto" ondrop="drop(event)" ondragover="allowDrop(event)">
</td>
</tr>
<tr class="tabelalinha">
<td class="produto" ondrop="drop(event)" ondragover="allowDrop(event)">
</td>
<td class="produto" ondrop="drop(event)" ondragover="allowDrop(event)">
</td>
<td class="produto" ondrop="drop(event)" ondragover="allowDrop(event)">
</td>
</tr>
<tr class="tabelalinha">
<td class="produto" ondrop="drop(event)" ondragover="allowDrop(event)">
</td>
<td class="produto" ondrop="drop(event)" ondragover="allowDrop(event)">
</td>
<td class="produto" ondrop="drop(event)" ondragover="allowDrop(event)">
</td>
</tr>
<tr class="tabelalinha">
<td colspan="3">
<table id="conteudoCen2">
<tr class="tabelalinha">
<td id="destaque" class="produto" ondrop="drop(event)" ondragover="allowDrop(event)">
</td>
<td class="produto" ondrop="drop(event)" ondragover="allowDrop(event)">
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</div>
<div ondrop="drop(event)" ondragover="allowDrop(event)" class="img_slides_wrap slides_wrap wrap">
</div>
<div class="produtos">
<div class="caixa"><h2> SELEÇÃO DE OFERTAS </h2>
<div style="text" id="project-label">
NOME DO PRODUTO: <input id="project" onfocus="limpaClick(event)"/>
<p id="project-description"></p>
<div id="project-icon"></div>
<input type="hidden" id="project-id">
<div class="caixaitem"><form method="post" action="" onsubmit="$('#val1').val($('#content').html());$('#val2').val($('#styleContent').text())">
<input type="hidden" name="val1" id="val1">
<input type="hidden" name="val2" id="val2">
<input type="submit" id="btnSave" value="GERAR TEMPLATE" name="botao"/></div>
</form>
</div><div class="lixeira" ondragover="allowDrop(event)" ondrop="exclui(event)"><img src="img/lixeira.png" /></div>
</div>
</div>
</div>
</body>Olá, Loki.
Você tem uma representação visual desse slideshow? Pois seu código esta muito complicado.
Se você tiver um exemplo visual(tela) vai ajudar bastante.
[]'s
Marco Bruno.
Marco,
Não tenho uma representação visual. Posso tentar ser mais claro:
-É colocada a imagem;
-Se colocada outra imagem na mesma linha/coluna que a primeira, é criado abaixo dessa imagem um bullet com a quantidade de imagens. (Ex: Duas imagens são sobrepostas, sendo assim, são criados 2 "•" logo abaixo delas;
-O Primeiro "•" fica em negrito e o segundo esbranquiçado (Ativo e Inativo);-Ao clicar na imagem, é realizado um fadeout na primeira e um fadeIn na segunda, alterando qual "•" está ativo.
Consegui explicar?
Olá, Loki.
Manda o HTML, para gente dar uma olhada?
[]'s
Marco Bruno.