Jump to content

AndréAraujo

Members
  • Content count

    42
  • Joined

  • Last visited

  • Days Won

    1

Everything posted by AndréAraujo

  1. Olá pessoal, venho procurando uma maneira de fazer com que o evento mousemove seja reconhecido quando executado sobre um iframe do YouTube, minha ideia inicial foi sobrepor uma div ao iframe, mas o devido aos banners e anúncios em vídeo a ideia se tornou inviável. Procurei por um bom tempo soluções, não encontrei nenhuma que eu pudesse compreender e adaptar-la ao meu projeto. Montei um pequena simulação do projeto para tornar mais fácil a exibição do problema: <!doctype html> <html> <head> <meta charset="utf-8"> <title>Documento sem título</title> <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js' type='text/javascript'></script> </head> <body> <style> .area-mousemove{ width:600px; height:500px; background-color:#09F; margin:0 auto; } .container{ max-width:600px; max-height:337.5px; position:relative; } .container-player{ padding-bottom:56.25%; height:0; background-color:#222; } #ytplayer{ display:block; } .container-player iframe, .container-player object, .container-player embed{ background-color:#000; position:absolute; top:0; left:0; width:100%; height:100%; border:0; z-index:1; } .controls{ width:100%; height:40px; background-color:#F60; position:absolute; z-index:1; bottom:0; left:0; display:none; } .text{ line-height:40px; margin-left:20px; font-family:Arial; font-size:18px; font-weight:700; color:#000; display:table; float:left; cursor:default; } .screen{ line-height:40px; background-color:#222; margin-right:20px; padding:0 10px; font-family:Arial; font-size:18px; font-weight:700; color:#fff; float:right; cursor:pointer; } .close-screen{ line-height:40px; background-color:#222; margin-right:20px; padding:0 10px; font-family:Arial; font-size:18px; font-weight:700; color:#fff; float:right; display:none; cursor:pointer; } </style> <div class="area-mousemove"> <div class="container"> <div id="container-screen"> <div class="container-player"> <iframe id="ytplayer" type="text/html" src="https://www.youtube.com/embed/2TvNnW2Br70?controls=0&rel=0&showinfo=0" frameborder="0" allowfullscreen></iframe> <div class="controls"><span class="text">Controles</span><span class="screen start">Screen</span><span class="close-screen start">[ x ]</span></div> </div> </div> </div> </div> <script> $('.area-mousemove').mousemove(function(cursor){ $('.controls').fadeIn(200); hideStart(); }); var timeout; function hideStart(){ if(timeout !== undefined){ clearTimeout(timeout); } timeout = setTimeout(function(){ $('.controls').fadeOut(200); }, 2500); } $('.controls span.start').on('click', function(a){ $('.screen').hide(); $('.close-screen').show(); var elem = document.getElementById("container-screen"); if(elem.requestFullscreen){ elem.requestFullscreen(); }else if(elem.mozRequestFullScreen){ /* Firefox */ elem.mozRequestFullScreen(); }else if(elem.webkitRequestFullscreen){ /* Chrome, Safari & Opera */ elem.webkitRequestFullscreen(); }else if(elem.msRequestFullscreen){ /* IE/Edge */ elem.msRequestFullscreen(); } screenfull.toggle($('#container-screen')[0]); }); if (document.addEventListener){ document.addEventListener('webkitfullscreenchange', exitHandler, false); document.addEventListener('mozfullscreenchange', exitHandler, false); document.addEventListener('fullscreenchange', exitHandler, false); document.addEventListener('MSFullscreenChange', exitHandler, false); } function exitHandler(){ if(!document.webkitIsFullScreen && !document.mozFullScreen && !document.msFullscreenElement){ $('.close-screen').hide(); $('.screen').show(); $('.controls').css('position', 'absolute'); } } </script> <script type="text/jscript" src="https://AndreAraujo1.github.io/screen/screen.js"></script> </body> </html> Agradeço a atenção!
  2. Olá, estou tentando enviar um array multidimensional para o Promise.all(), mas mesmo pegando a property path direto do navegador o items["0"] aparece como undefined, é possível ver que o objeto esta acessível pelo console.log(data[0]) ou console.log(data[1]), segue o código abaixo: <!doctype html> <html> <head> <meta charset="utf-8"> <title>Promise Multidimensional Array</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> </head> <body> <button onClick="start()">Start</button> <script> function start(){ var array = [ ["hTWKbfoikeg","Nirvana - Smells Like Teen Spirit"], ["1G4isv_Fylg","Coldplay - Paradise"], ["NMNgbISmF4I","Aerosmith - Crazy"], ["btPJPFnesV4","Survivor - Eye Of The Tiger"], ["gEPmA3USJdI","AC/DC - Highway to Hell"] ], promises = [], list = []; for(var i =0; i < array.length; i++){ pushGet(array[i][0],array[i][1]); //pushGet(array[i][0]); } Promise.all(promises).then(function(r){ r.forEach(function(data){ console.log(data[0]); console.log(data[1]); var title = data[1]; //var viewCount = parseInt(data["0"].responseJSON.items["0"].statistics.viewCount); //var currentId = data["0"].responseJSON.items["0"].id; list.push([/*viewCount,currentId,*/title]); }); }); console.log(list); function pushGet(id,title){ var val = $.getJSON("https://www.googleapis.com/youtube/v3/videos?part=contentDetails,statistics&id=" + id + "&key=AIzaSyDIWyCOtTKDFyH9N4YlQPBP8VG4NX3Pgp4"); promises.push([val,title]); //promises.push(val); } } </script> </body> </html> Agradeço a atenção!
  3. AndréAraujo

    Nomear array criado dentro do Ajax

    Olá William Bruno, Muito obrigado por sua imensa ajuda, a ordem de carregamento esta perfeita. Fiz umas pequenas alterações no script para a criação dos grupos de array. <!doctype html> <html> <head> <meta charset="utf-8"> <title>Documento sem título</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> </head> <body> <div class="label-head"> <span>Blogger</span>, <span>adsense</span>, <span>gadgets</span>, <span>10th Birthday</span> </div> <script> var eachLabel = []; var dataPost = []; var arrayLabel = []; $(".label-head span").each(function(){ eachLabel.push($(this).text()); }); console.log(eachLabel); var promises = [] eachLabel.forEach(function(label) { promises.push(fetch(label)) }); Promise.all(promises) .then(function(results) { results.forEach(function(data) { console.log(data.feed.link[1].href); //para debugar e você ver que manteve a ordem data.feed.entry.forEach(function(entry) { var title = entry.title.$t; dataPost.push([title]); }); arrayLabel.push(dataPost); //envia o grupo criado dataPost = [];//empedindo que o mesmo receba todos os arrays }); //return dataPost; }) /*.then(function(dataPost) { console.log(dataPost); });*/ function fetch(label) { return $.ajax({ url: "https://blogger.googleblog.com/feeds/posts/default/-/" + label + "?alt=json-in-script&max-results=10", type: "get", dataType: "jsonp" }) } console.log(arrayLabel); </script> </body> </html>
  4. AndréAraujo

    Nomear array criado dentro do Ajax

    Olá, tenho um script que busca informações de outras páginas e nele são gerados arrays que posteriormente são inseridos em outro array, não consigo fazer com que os arrays mantenham uma ordem para que eu possa acessar o item correto. Pensei em colocar o nome em cada array , mas não obtive sucesso em puxar o nome para dentro do Ajax. Como eu faço para que os arrays carreguem na ordem certa ou como inserir o nome da label no array? Segue o script abaixo: <!doctype html> <html> <head> <meta charset="utf-8"> <title>Documento sem título</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> </head> <body> <div class="label-head"> <span>Blogger</span>, <span>adsense</span>, <span>gadgets</span>, <span>10th Birthday</span> </div> <script> eachLabel = new Array(); dataPost = new Array(); arrayLabel = new Array(); $(".label-head span").each(function(){ eachLabel.push($(this).text()); }); console.log(eachLabel); for(var l = 0;l < eachLabel.length;l++){ label = eachLabel[l]; $.ajax({ url: "https://blogger.googleblog.com/feeds/posts/default/-/" + label + "?alt=json-in-script&max-results=10", type: "get", dataType: "jsonp", success: function(data){ for(var i = 0;i < data.feed.entry.length;i++){ var title = data.feed.entry[i].title.$t; dataPost.push([title]); } //arrayLabel[label] = new Array(dataPost); arrayLabel.push(dataPost); dataPost = []; } }) } console.log(arrayLabel); </script> </body> </html> Agradeço a atenção!
  5. Gostaria de saber se é possível remover e os itens que são acionados ao final do vídeo, no caso "Tela final e anotações" conforme o mostrado na imagem abaixo, eu já estou utilizando o "rel: 0" e o "iv_load_policy: 3" que estão funcionando bem para a não exibição das anotações e não exibição de miniaturas após o encerramento do vídeo. Agradeço a atenção!
  6. AndréAraujo

    Areá clicável dentro de área clicável

    Olá HwapX, muito obrigado por sua ajuda, acabei optando pela primeira solução pois se encaixou perfeitamente o código e exigiu menos alterações, eu já tinha uma estrutura grande voltada para esse código e tive um pouco de medo de ter que refaze-lá. Mais uma vez muito obrigado!
  7. Olá, estou precisando inserir um botão delete dentro de cada item de uma lista que já tem uma função especifica para selecioná-la, alguém sabe se tem um modo de executar esta ação sem gerar o conflito abaixo? Segue minha ideia inicial: <!doctype html> <html> <head> <meta charset="utf-8"> <title>Documento sem título</title> <link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> </head> <body> <style> #list ul{ margin:0; padding:0; } #list ul li{ width:300px; height:30px; background-color:#F60; margin-bottom:10px; padding:10px; list-style:none; } #list ul li span{ line-height:30px; color:#FFF; font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif; font-size:14px; } #list ul li i{ line-height:30px; color:#FFF; font-size:14px; float:right; } #list ul li.active{ background-color:#F30; } </style> <div id="list"> <ul> <li><span>Item 1</span><i class="fa fa-times"></i></li> <li><span>Item 2</span><i class="fa fa-times"></i></li> <li><span>Item 3</span><i class="fa fa-times"></i></li> <li><span>Item 4</span><i class="fa fa-times"></i></li> </ul> </div> <script> $(document).on('click', '#list ul li', function(){ $('#list ul li').removeClass("active"); $(this).addClass('active').fadeIn(200); alert("Você selecionou o " + $(this).text()); }); $(document).on('click', 'i.fa-times', function(){ alert("Você removeu o " + $(this).parent().find('span').text()); $(this).parent().remove(); }); </script> </body> </html> Agradeço a atenção!
  8. AndréAraujo

    innerHTML x javascript - undefined

  9. AndréAraujo

    Sobrepor div a um <iframe> em modo fullscreen

    Olá Joao_Lucaas, consegui resolver o problema de uma forma até bem simples, no lugar de chamar o id "ytplayer" do iframe no script, chamei o id "contarner_video" / "container_video" , aplicando fullscreen na div e não no iframe, fazendo com que a div "controls" ficasse visível no modo fullscreen em todos os navegadores que testei.
  10. Um exemplo, no Google Chrome o "z-index:2147483647" consegue fazer a div se sobrepor ao iframe sem problemas, já nos outros navegadores não estou conseguindo fazer <div id"controls"> se sobrepor ao iframe, alguém conhece alguma forma de sobrepor o iframe ou tem alguma ideia do que eu estou fazendo de errado? Segue o exemplo: <!doctype html> <html> <head> <meta charset="utf-8"> <title>Teste</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <style> #contarner_video{ padding-bottom:56.25%; height:0; border-radius:inherit; overflow:hidden; z-index:0; } #contarner_video iframe{ position:absolute; top:0; left:0; width:100%; height:100%; border:0; } #ytplayer{ display:block; } #controls{ width:100%; height:30px; background-color:#000; opacity:0.9; position:absolute; top:0; left:0; z-index:2147483647; } #controls span{ line-height:30px; padding:0 20px; color:#fff; float:right; } </style> </head> <body> <div id="contarner_video"> <iframe id="ytplayer" type="text/html" width="720" height="405" src="https://www.youtube.com/embed/M7lc1UVf-VE?controls=0&enablejsapi=1&fs=0&rel=0&showinfo=0&iv_load_policy=3" frameborder="0" allowfullscreen></iframe> <div id="controls"> <span>FullScreen</span> </div> </div> <script> $('#controls span').on('click', function(){ var e = document.getElementById("ytplayer"); if (e.requestFullscreen) { e.requestFullscreen(); } else if (e.mozRequestFullScreen) { e.mozRequestFullScreen(); } else if (e.webkitRequestFullscreen) { e.webkitRequestFullscreen(); } else if (e.msRequestFullscreen) { e.msRequestFullscreen(); } }); </script> </body> </html>
  11. AndréAraujo

    Sobrepor div a um <iframe> em modo fullscreen

    Olá Joao_Lucaas, obrigado por me responder! Acho que acabei me expressando mal, não citei que no exemplo acima o vídeo esta configurado para ocupar 100% da tela mas não esta em fullscreen, tem um botão escrito FullScreen no canto superior direito que ativa o fullscreen. Caso não seja esse o caso minhas versões de navegadores são: Google Chrome 64.0.3282.167 (Versão oficial) 32 bits (atualizado) (sem bug) Opera (51.0) 51.0.2830.34 (atualizado) (sem bug) Firefox Quantum 58.0.2 (32-bit) (atualizado) (com bug) Microsoft Edge 20.10240.16384.0 (com bug) Internet Explorer(11) 11.0.10240.16384 (com bug) Navegadores com bug: Navegadores sem bug: O código que eu estou testando é esse mesmo.
  12. Olá pessoal, eu tenho dois select onde um é de categoria e o outro é de sub-categoria. O primeiro select é carregado na página normalmente, eu busco o valor do <option> que esta selecionado usando JQuery. Já o segundo select é carregado via Ajax e assim o JQuery não é executado ao carregar a página: Não reconhece: $(document).ready(function(){ var sub_categoria = $("#id_sub_categoria option:selected").text(); document.getElementById("sub").innerHTML = sub_categoria; }); Assim é reconhecido: $(document).on("click", "#id_sub_categoria", function(){ var sub_categoria = $("#id_sub_categoria option:selected").text(); document.getElementById("sub").innerHTML = sub_categoria; }); Meu script: <script> $(document).ready(function(){ $("#id_categoria").click(function(){ var id_categoria = $("#id_categoria option:selected").text(); document.getElementById("cat").innerHTML = id_categoria; }); var id_categoria = $("#id_categoria option:selected").text(); document.getElementById("cat").innerHTML = id_categoria; }); $(document).on("click", "#id_sub_categoria", function(){ var sub_categoria = $("#id_sub_categoria option:selected").text(); document.getElementById("sub").innerHTML = sub_categoria; }); </script> Como faço para executar o JQuery ao carregar a página e reconhecer o select que foi carregado via Ajax, sem precisar do click ou change? Agradeço a atenção!
  13. AndréAraujo

    como executar função ao carregar a página?

    Sim Ctrl + c Ctrl + v, ele não reconhece o valor msm, o meu select seleciona o valor que for igual ao valor do banco de dados, no código fonte da para ver perfeitamente que exite valor no <option> e que o valor que é igual ao do banco recebeu o selected, sem contar que com o change o script funciona corretamente.
  14. Olá pessoal, estou com uma dúvida referente ao Ajax, necessito que o item selecionado no primeiro select seja enviado ao carregar a página, quando faço seleção diretamente no primeiro select o segundo é chamado normalmente, tentei trocar o change por focus mas não obtive resultado. <label for="id_categoria">Categoria:</label><br> <select name="id_categoria" id="id_categoria"> <!--Aqui existe um script que seleciona o registro que esta no banco de dados --> <!--Exemplo:<option value="1" selected>Valor 1</option> --> <option value="1">Valor 1</option> <option value="2">Valor 2</option> <option value="3">Valor 3</option> </select><br><br> <label for="id_sub_categoria">Sub-Categoria:<span class="carregando"> Carregando...</span></label><br> <select name="id_sub_categoria" id="id_sub_categoria"></select> <script src="http://www.google.com/jsapi"></script> <script type="text/javascript"> google.load('jquery', '1.3'); </script> <script type="text/javascript"> $(function(){ $('#id_categoria').change(function(){ if( $(this).val() ) { $('#id_sub_categoria').hide(); $('.carregando').show(); $.getJSON('sub_categoria.ajax.php?search=',{id_sub_categoria: $(this).val(), ajax: 'true'}, function(j){ var options = '<option value=""></option>'; for (var i = 0; i < j.length; i++) { options += '<option value="' + j[i].id_sub_categoria + '">' + j[i].nome_sub_categoria + '</option>'; } $('#id_sub_categoria').html(options).show(); $('.carregando').hide(); }); } else { $('#id_sub_categoria').html('<option value="">– Escolha uma Categoria –</option>'); } }); }); </script> Agradeço a atenção!
  15. AndréAraujo

    como executar função ao carregar a página?

    Olá DSerma, obrigado pela atenção, como avia dito acima, ao retirar o: $('#id_categoria').change(function(){ o script não reconhece o valor do id do select "#id_categoria", como não tem valor ele cai no else e assim a mensagem de erro é exibida no select. Eu não sei como substituir esta linha. Sobre decidir qual evento eu vou usar, vou usar onchange e onload, mesmo que tenha que criar dois eventos separados.
  16. AndréAraujo

    como executar função ao carregar a página?

    Olá BRAndersonLuciona, obrigado pela atenção, a página onde o select vai ser exibido é uma página para criar e editar conteúdo, no caso de criação de conteúdo o primeiro option será vazio para que o usuário escolha a categoria desejada, até aqui o código já está funcionando corretamente. Mas na parde de editar o conteúdo, a seleção automática é indispensável pois o primeiro select tem que carregar a categoria encontrada no banco de dados, "até aqui tudo funcionando".
  17. AndréAraujo

    como executar função ao carregar a página?

    Olá reebr, primeiramente obrigado pela atenção, o meu problema se encontra nesta linha: $('#id_categoria').change(function(){ sem ela o valor do select não entra, tentei inserir o load, focus e mais algumas outras coisas. Até agora não encontrei nada, meu conhecimento sobre a linguagem é limitado, você não tem alguma ideia de algo que eu possa fazer?
  18. Olá wootzor, muito obrigado pela dica do: var primeiro = $('.botao').first(); Sobre fazer o script reconhecer a imagem colorida correta foi só add a class + .active. Ex: .div1.active, .div1:hover{ background-image:url(imagens/div1_colorida.png); background-position:center; background-repeat:no-repeat; } .div2.active, .div2:hover{ background-image:url(imagens/div2_colorida.png); background-position:center; background-repeat:no-repeat; } .div3.active, .div3:hover{ background-image:url(imagens/div3_colorida.png); background-position:center; background-repeat:no-repeat; } Agora estou tentando fazer com que o script reconheça as divs para gerar os efeitos de transição sem que eu tenha que ficar adicionando classe por classe em um script separado. Só que até agora não obtive muito sucesso. Quando conseguir postarei aqui, mais uma vez obrigado pela atenção.
  19. Olá, tenho um JavaScript para deixar o primeiro botão de uma determinada lista ativo e manter os outros selecionados ao clicar. Como não tenho muito conhecimento em JQuery resolvi criar outras funções para gerar os efeitos de transição, até ai tudo bem o código funcionou "corretamente", mas agora resolvi adicionar imagens na lista de botões, cada botão tem uma imagem diferente onde os botões inativos tem imagens em preto e branco e o ativo tem uma imagem colorida. Gostaria de saber se alguém tem alguma sugestão de como fazer o script reconhecer a classe do botão ativo para chamar a imagem correta, também fazer o efeito fadeIn() para a div que foi chamada e o efeito hide() para a div que foi ocultada. Atualmente meu script se encontra assim: <script src="js/jquery.js"></script> <script> $(document).ready(function(){ $("#f1").click(function(){ $("#div1").fadeIn(500); $("#div2").hide(); $("#div3").hide(); }); $("#f2").click(function(){ $("#div2").fadeIn(500); $("#div1").hide(); $("#div3").hide(); }); $("#f3").click(function(){ $("#div3").fadeIn(500); $("#div1").hide(); $("#div2").hide(); }); }); </script> <style> .active{ background-color:#dadada; } .div1{ background-image:url(imagens/div1_preto_e_branco.png); background-position:center; background-repeat:no-repeat; } .div2{ background-image:url(imagens/div2_preto_e_branco.png); background-position:center; background-repeat:no-repeat; } .div3{ background-image:url(imagens/div3_preto_e_branco.png); background-position:center; background-repeat:no-repeat; } .div1:hover{ background-image:url(imagens/div1_colorida.png); background-position:center; background-repeat:no-repeat; } .div2:hover{ background-image:url(imagens/div2_colorida.png); background-position:center; background-repeat:no-repeat; } .div3:hover{ background-image:url(imagens/div3_colorida.png); background-position:center; background-repeat:no-repeat; } </style> <ul> <li><a type="button" id="f1" class="botao div1"></a></li> <li><a type="button" id="f2" class="botao div2"></a></li> <li><a type="button" id="f3" class="botao div3"></a></li> </ul> <div id="div1" style="display:block;">Conteúdo 1</div> <div id="div2">Conteúdo 2</div> <div id="div3">Conteúdo 3</div> <script> $(document).ready(function () { $('a.botao').click(function () { $('a.botao.active').removeClass("active"); $(this).addClass("active"); }); var primeiro = document.getElementsByClassName('botao')[0]; if (primeiro) $(primeiro).addClass("active"); }); </script> Agradeço a atenção
  20. AndréAraujo

    Erro ao exibir conteúdo dos posts

    ESerra agradeço muito pela ajuda, estava enroscado nessa parte do código, realmente achava que no local do índice entrava uma variável. Brigadão mesmo ajudou muito!
  21. AndréAraujo

    Erro ao exibir conteúdo dos posts

    Olá pessoal, estou com um problema para chamar os dados de uma determinada tabela de um banco de dados para uma index, como sou novato em php estava seguindo um tutorial e me deparei com um erro no código onde acabei ficando perdido, acontece o seguinte: <?php require_once '../system/config.php'; require_once '../system/database.php'; ?> <!DOCTYPE html><html lang="pt-BR"> <head> <meta charset="UTF-8"><title>Gerenciar Postagens</title> </head> <body> <h2> Gerenciar Postagens | <a href="add-post.php" title="Adicionar">Adicionar</a> </h2> <?php $posts = DBRead( 'posts', 'ORDER BY data DESC'); var_dump( $posts ); <******************* consegue mostrar todos os dados if( !$posts ) echo '<h2>Nenhuma postagem encontrada!</h2>'; else foreach( $posts as $post ): ?> <h2><?php echo $post['$titulo']; ?></h2> <p>por: <b><?php echo $post['$autor']; ?></b> em: <b><?php echo date( 'd/m/y', strtotime( $post['dada'] ) ) ?></b> | Visitas: <b><?php echo $post['$visitas']; ?></b></p> <?php endforeach; ?> </body> </html> _____________________________________________//_____________________________________________ Alguém sabe como eu faço para chamar essas variáveis para a página sem estes erros? Agradeço a atenção!
  22. AndréAraujo

    Sobrepor div com imagem

    Olá wilnet, o maior desafio dessa tarefa é fazer com que o imagem que se sobrepõe fique abaixo do link, e se for adicionada outra imagem dentro do link o script intende ela como mais uma imagem do slide. Mesmo assim obrigado por seu interesse em ajudar.
  23. AndréAraujo

    Sobrepor div com imagem

    Olá pessoal, eu tenho um slide onde preciso adicionar uma imagem que fique sempre sobreposta as imagens do slide e se repita com "repeat fixed", mais não estou obtendo sucesso. Meu código CSS: #featured { height: 328px; width: 665px; overflow: hidden; margin:0 0 0 10px; float:left; } div.orbit { width: 1px; height: 1px; position: relative; overflow: hidden; } #featured img{ width:665px !important; height:328px !important; } div.orbit img { position: absolute; top: 0; left: 0; } div.orbit a img {border: none;} div.timer { width: 40px; height: 40px; overflow: hidden; position: absolute; top: 10px; right:10px; opacity: .6; cursor: pointer; z-index: 1001; } span.rotator { display: block; width: 40px; height: 40px; position: absolute; top: 0; left: -20px; background: url(https://rotator-black.png); background-repeat: no-repeat; z-index: 3; } span.mask { display: block; width: 20px; height: 40px; position: absolute; top: 0; right: 0; z-index: 2; overflow: hidden; } span.rotator.move {left: 0;} span.mask.move { width: 40px; left: 0; background: url(https://timer-black.png); background-repeat: repeat; background-position: 0px 0px; } span.pause { display: block; width: 40px; height: 40px; position: absolute; top: 0; left: 0px; background-image: url(https://pause.png); background-repeat: no-repeat; z-index: 4; opacity: 0; } div.timer:hover span.pause, span.pause.active, div.timer:hover span.pause.active { opacity: 1; } div.caption { background: #000; background: rgba(0,0,0,.6); width: 100%; z-index: 1000; position: absolute; bottom:-100px; color: #fff; padding: 8px 0; text-align: center; } div.caption span { padding: 0 10px; font-size: 18px; text-shadow: 0px 1px 0px rgba(0,0,0,.8); margin: 0; } .orbit-caption { display: none; } div.orbit:hover div.slider-nav { display: block; } div.slider-nav { display: none; } div.slider-nav span { width: 33px; height: 33px; text-indent: -9999px; position: absolute; z-index: 1000; top: 43%; cursor: pointer; } div.slider-nav span.right { background-image: url(https://seta/right.png); right: 10px; } div.slider-nav span.left { background-image: url(https://seta/left.png); left: 10px; } .orbit-bullets { position: absolute; z-index: 999; list-style: none; top: 10px; left: 7px; margin: 0; padding: 0; } .orbit-bullets li { float: left; margin-left: 5px; cursor: pointer; color: #999; text-indent: -9999px; background-image: url(https://bullets.png); background-repeat: no-repeat; background-position: 0 0; width: 7px; height: 7px; overflow: hidden; } .orbit-bullets li.active { color: $(second.color); background-position: -7px 0; } Biblioteca: <script src='http://jquery.min.js' type='text/javascript'/> Script: <!--[if IE]> <style type="text/css"> .timer { display: none !important; } div.caption { background:transparent; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000);zoom: 1; } </style> <![endif]--> <script type='text/javascript'> $(window).load(function() { $('#featured').orbit({ advanceSpeed: 7000, 'bullets': true, 'timer' : true, 'animation' : 'horizontal-slide' }); }); </script> Meu código HTML: <div id='featured'> <a href="http://link1"><img src="https://limagem1.jpg"/></a><span class='orbit-caption'><b>Descrição</b></span> <a href="http://link2"><img src="https://limagem2.jpg"/></a><span class='orbit-caption'><b>Descrição</b></span> <a href="http://link3"><img src="https://limagem3.jpg"/></a><span class='orbit-caption'><b>Descrição</b></span> <a href="http://link4"><img src="https://limagem4.jpg"/></a><span class='orbit-caption'><b>Descrição</b></span> </div> Agradeço a atenção!
  24. AndréAraujo

    Como copiar uma palavras de um TMemo e transferila para um edit

    Muito obrigado, LazaroBinda!
  25. Olá pessoal, gostaria de encontrar uma linha de um TMemo por duas palavras que apareceram nela e copiar a palavra para um edit. exemplo: palavras que quero encontrar: ativo e inativo. texto texto texto texto texto texto ativo texto texto texto texto texto texto texto texto texto inativo texto texto texto nem sempre elas aparecerão na mesma na mesma linha, por isso a necessidade de buscar a linha pela palavra. Agradeço a atenção!
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.