Jump to content

sthefany silva

Members
  • Content count

    6
  • Joined

  • Last visited

Community Reputation

0 Comum

About sthefany silva

  • Birthday 12/27/1999

Informações Pessoais

  • Sexo
    Feminino

Contato

  1. sthefany silva

    [Resolvido] Exibir imagem do banco de dados MySQL no HTML com PHP

    e como faria isso? tem algum exemplo?? estou com uma duvida bem pareida, porem no meu caso estou utilizando arquitetura mvc, e mminha imagem deverá ser puxada e passada para dentro de um input, mas não sei bem como fazer isso rs. poderia me ajudar?
  2. Olá, minha dúvida é ao fazer um selecte em algum as opções do autocomplete mostrar contudo na pág. e ao limpar os dados inseridos no input fazer com que volte ao estado anterior. ou seja, ao seleconar ele abrirar o que foi seleconado, ao limpar campus do input mostrar topicos anterior. segue abaixo meus códigos: HTML: <form class="submit-line" id="form"> <input id="buscaPerguntas" autocomplete="off" class="form-control input-faq" placeholder="Digite palavras-chaves para pesquisar" style="padding: 28px;"> </form> </div> </div> </div> <div class="row"> <div id="buscaPerguntas-description"> </div> </div> <div class="divFaq" id="listaFaq"> <div class="row"> {% for valor in faq%} <div class="col-sm-12"> <div class="boxFaq"> <a class="btn btn-faq accordion" type="button" data-toggle="collapse" data-target="#{{valor.id}}" aria-expanded="true"> {{valor.pergunta}} </a> </div> </div> <div class="col-sm-12"> <div id="{{valor.id}}" class="collapse"> <div class="boxFaq"> <div class="card-body"> <div>{{valor.resposta|raw}}</div> </div> </div> </div> </div> {% endfor %} </div> JAVASCRIPT: $(function () { $("#buscaPerguntas").autocomplete({ autoFocus: true, minLength: 1, appendTo: '#form', source: function (request, response) { $.ajax({ url: '/pesquisafaq', type: 'post', data: { dadosPesquisa: request.term } }).done(function (data) { let parse = JSON.parse(data) if (parse.length > 0) { let dados = Object.values(parse).map((e) => { return { label: e.pergunta, desc: "<div class='divFaqCollapse'><div class='col-sm-12'><div class='boxFaq'><a class='btn btn-faq accordion' type='button' data-toggle='collapse' data-target='#collapse' aria-expanded='true'>" + e.pergunta + "</a></div></div> <div class='col-sm-12'> <div id='collapse' class='collapse'> <div class='boxFaq'> <div class='card-body'> <div>" + e.resposta + "</div> </div> </div> </div> </div> </div>", } }) response(dados.slice(0)) } }); }, select: function (event, ui) { $("#buscaPerguntas").val(ui.item.label); $("#buscaPerguntas-description").html(ui.item.desc); $('#listaFaq').hide(); $('#buscaPerguntas-description').show(); } }) });
  3. sthefany silva

    buscando dados em banco e visualizando em html

    oi, estou desenvolvendo um sistema de FAQ, e preciso listar do meu banco de dados as perguntas e respostas dentro de um collapse. mas confesso que sou um pouco leiga sobre o assunto. não sei se o problema é com minha lógica, mas quando tento abrir o arquivo aparece que a página não foi localizada. segue código abaixo: ajuda.php <?php function listarPerguntas($mysqli){ $perguntasFaq= array(); $respostaFaq= array(); } $sqlAjudaFaq =$mysqli->query ("SELECT pergunta_FAQ, resposta_FAQ, id, FROM ajuda_FAQ"); while($lAjudaFaq = $sqlAjudaFaq->fetch_array()) { $perguntasFaq[] = array( "pergunta" => $lAjudaFaq['pergunta_FAQ'], "resposta" =>$lAjudaFaq['resposta_FAQ']); } ?> controles: public function ajuda(Application $app){ include("../includes/ds8.php"); include("../src/App/funcoes.php"); include("../src/App/ajuda.php"); return $app['twig']->render('ajuda.html'); } html: <div class="row"> <div class="col-sm-12"> <div class="boxFaq"> <a class="btn btn-faq accordion" type="button" id="busca_pergunta" data-toggle="collapse" data-target="#collapse_resposta_faq" aria-expanded="true"> {{%pergunta.pergunta_FAQ}} </a> </div> </div> <div class="col-sm-12"> <div id="collapse_resposta_faq" class="collapse"> <div class="card-body"> {{%resposta.resposta_FAQ}} </div> </div> </div> </div>
  4. sthefany silva

    menu responsivo

    oi, estou desenvolvendo abas de navegação utilizando bootstrap, porém gostaria de tornar ele responsivo pois as abas não se alinham em telas menores e as abas ficam bagunçadas. segue código abaixo: em html: <div class="row"> <div class="col-lg-12"> <h3 class="page-header">Central de ajuda</h3> </div> </div> <div class="row"> <div class="col-lg-12"> <ul class="nav nav-tabs round" id="#" role="tablist"> <li class="active"> <a id="tutorial-tab" data-toggle="tab" href="#tutorial" role="tab" aria-controls="tutorial" aria-selected="true"><span><i class="fas fa-book-reader"></i> Tutorial</a> </span> </li> <li> <a id="tarefa-tab" data-toggle="tab" href="#tarefa" role="tab" aria-controls="tarefa" aria-selected="false"> <span><i class=" fa fa-list-alt"></i> Tarefa</a> </li></span> <li> <a id="sugestao-tab" data-toggle="tab" href="#sugestao" role="tab" aria-controls="sugestao" aria-selected="false"><span> <i class="fa fa-lightbulb-o"></i> Sugestão</a></span> </li> <li> <a id="faq-tab" data-toggle="tab" href="#faq" role="tab" aria-controls="faq" aria-selected="true"><span><i class=" fa fa-search"></i> FAQ</a> </span> </li> </ul> </div> css: .nav-tabs { border-bottom: 1px solid var(--cor-primaria); overflow: hidden; transition: border 250ms ease; } .nav-tabs > li { margin: 0px; padding: 0px; float: left; padding-left: 48px; list-style-type: none; } .nav-tabs >li *{ margin: 0px; padding: 0px; } .nav-tabs > li > a { margin-right: 2px; line-height: 1.42857143; display: block; float: right; padding: 10px 24px 8px; background-color: #f2f2f2; z-index: 2; position: relative; color: #666666; text-transform: uppercase; transition: all 250ms ease; border-top: 0.5px solid rgba(204, 204, 204, 0.1803921568627451); } .nav-tabs > li > a:before, .nav-tabs > li > a:after{ display: block; content: " "; position: absolute; top: 0; height: 100%; width: 44px; background-color:#f2f2f2; transition: all 250ms ease; } .nav-tabs > li > a:before { right: -24px; transform: skew(30deg, 0deg); box-shadow: rgba(0,0,0,.1) 3px 2px 5px, inset rgba(255,255,255,.09) -1px 0; border-top: 0.5px solid rgba(204, 204, 204, 0.1803921568627451); } .nav-tabs > li > a:after { left: -24px; transform: skew(-30deg, 0deg); box-shadow: rgba(0,0,0,.1) -3px 2px 5px, inset rgba(255,255,255,.09) 1px 0; border-top: 0.5px solid rgba(204, 204, 204, 0.1803921568627451); } .nav-tabs > li > a:hover, .nav-tabs > li > a:hover:before, .nav-tabs > li > a:hover:after { background-color: var(--cor-primaria); color: #fff; border-top: 0px; } .nav-tabs >li.active > a{ z-index: 3; } .nav-tabs > li.active > a, .nav-tabs > li.active > a:before, .nav-tabs > li.active > a:after { color: #fff; background-color: var(--cor-primaria); cursor: default; font-weight: 700; border-top: 0px; } /* Round Tabs */ .nav-tabs.round >li > a{ border-radius: 8px 8px 0 0; } .nav-tabs.round > li > a:before { border-radius: 0 8px 0 0; } .nav-tabs.round > li > a:after { border-radius: 8px 0 0 0; } tbm já tentei fazer utilizando o @media porém não ajusta certinho. poderia me dar essa ajuda.
  5. sthefany silva

    menu com aba inclinada

    muito me ajudou bastante. muito obrigada.
  6. sthefany silva

    menu com aba inclinada

    oi, estou desenvolvendo uma página html e estou utilizando bootstrap, gostaria de fazer um menu com abas e que fosse levemente iclinado para direita... mais ou menos como essa ideia do arquivo... segue meu código html: <ul class="nav nav-tabs" id="#" role="tablist"> <li class="nav-item active"> <a class="nav-link" id="tarefa-tab" data-toggle="tab" href="#tarefa" role="tab" aria-controls="tarefa" aria-selected="false"> <i class=" fa fa-list-alt"></i> Tarefa</a> </li> <li class="nav-item"> <a class="nav-link" id="sugestao-tab" data-toggle="tab" href="#sugestao" role="tab" aria-controls="sugestao" aria-selected="false"><i class="fa fa-lightbulb-o"></i> Sugestão</a> </li> <li class="nav-item"> <a class="nav-link" id="faq-tab" data-toggle="tab" href="#faq" role="tab" aria-controls="faq" aria-selected="true"><i class=" fa fa-search"></i> FAQ</a> </li> </ul> segue meu código css: .nav-tabs { border-bottom: 2px solid var(--cor-primaria-2); } .nav-tabs > li { float: left; margin-bottom: -1px; /* margin-top: 0px; */ } .nav-tabs > li > a { margin-right: 2px; line-height: 1.42857143; border: 1px solid; border-bottom: 0px; border-radius: 4px 4px 0 0; color: #666666; background: rgba(204, 204, 204, 0.1803921568627451); } .nav-tabs > li > a:hover { border-color: #FFFFFF; }
×

Important Information

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