Pesquisar na Comunidade

A mostrar resultados para tags ''jquery''.

  • Pesquisa por Tags

    Introduza as tags separadas por vírgulas.
  • Pesquisar por Autor

Tipo de Conteúdo


Fórum

  • Bem-vindos ao Portugal-a-Programar
    • Sugestões, Críticas ou Dúvidas relativas ao P@P
    • Acerca do P@P
    • Apresentações
  • Comunidade a Trabalhar
    • Wiki P@P
    • Apresentação de Projectos de Programação
    • Downloads
  • Revista PROGRAMAR
    • Revista PROGRAMAR
  • Desenvolvimento Geral
    • C
    • C++
    • Java
    • Haskell
    • Pascal
    • Python
    • Bases de Dados
    • Visual Basic Clássico
    • Visual Basic for Applications (VBA)
    • Dispositivos Móveis
    • Outras Linguagens
  • Desenvolvimento Orientado para Web
    • PHP
    • HTML
    • CSS
    • Javascript
    • Outras Linguagens de WebDevelopment
    • Desenvolvimento Web
  • Desenvolvimento .NET
    • C#
    • Visual Basic .NET
    • ASP.NET
    • WPF & SilverLight
  • Software e Sistemas Operativos
    • Software de Produtividade
    • Sistemas Operativos
    • SharePoint
    • Apresentação de Software
  • Informática Extra-Programação
    • Interfaces Visuais
    • Computação Gráfica
    • Algoritmia e Lógica
    • Segurança e Redes
    • Hardware
    • Electrónica
    • Automação Industrial
    • Dúvidas e Discussão de Programação
    • Notícias de Tecnologia
  • Outras Áreas
    • Matemática
    • Dúvidas Gerais
    • Discussão Geral
    • Eventos
    • Anúncios de Emprego
    • Tutoriais
    • Snippets / Armazém de Código
  • Arquivo Morto
    • Projectos Descontinuados
    • System Empires

Blogs

  • Projectos
  • Revista PROGRAMAR
  • Blog dos Moderadores
  • Eventos
  • Notícias de Tecnologia
  • Blog do Staff
  • Wiki

Categorias

  • Revista PROGRAMAR
  • Tutoriais
  • Textos Académicos
  • Exercícios Académicos
    • Exercícios c/ Solução
    • Exercícios s/ Solução
  • Bibliotecas e Aplicações
  • Outros



Filtrar por número de...

99 resultados

  1. boas tenho aqui uma questão... estou a fazer um site com url amigaveis a minha questão é que estou a abrir uma pagina atraves do load o jquer....só que essa pagina não reconhece os url amigaveis existe alguma forma para sejam lidos? o meus jquery esta $("#lista_normal").on("click", function (){ $("#lista").load(url+"/cnt/listas_viaturas.php"); $(this).addClass("active-view-btn"); $("#lista_grelha").removeClass("active-view-btn"); }) a ideia é que a pagina listas_viaturas.php consiga ler o url amigavel o meu codigo de url amigavel é este define('url', 'omeusite'); $url = explode('/', $_GET['url']); $pasta1 = $url[0]; $pasta2 = $url[1]; $file= $url[2]; obrigado
  2. boas tenho aqui uma questão... estou a fazer um site com url amigaveis a minha questão é que estou a abrir uma pagina atraves do load o jquer....só que essa pagina não reconhece os url amigaveis existe alguma forma para sejam lidos? o meus jquery esta $("#lista_normal").on("click", function (){ $("#lista").load(url+"/cnt/listas_viaturas.php"); $(this).addClass("active-view-btn"); $("#lista_grelha").removeClass("active-view-btn"); }) a ideia é que a pagina listas_viaturas.php consiga ler o url amigavel o meu codigo de url amigavel é este define('url', 'omeusite'); $url = explode('/', $_GET['url']); $pasta1 = $url[0]; $pasta2 = $url[1]; $file= $url[2]; obrigado
  3. boas tenho aqui uma questão... estou a fazer um site com url amigaveis a minha questão é que estou a abrir uma pagina atraves do load o jquer....só que essa pagina não reconhece os url amigaveis existe alguma forma para sejam lidos? o meus jquery esta $("#lista_normal").on("click", function (){ $("#lista").load(url+"/cnt/listas_viaturas.php"); $(this).addClass("active-view-btn"); $("#lista_grelha").removeClass("active-view-btn"); }) a ideia é que a pagina listas_viaturas.php consiga ler o url amigavel o meu codigo de url amigavel é este define('url', 'omeusite'); $url = explode('/', $_GET['url']); $pasta1 = $url[0]; $pasta2 = $url[1]; $file= $url[2]; obrigado
  4. boa tarde eu estou a criar umas div dinamicamente depois de carregar a pagina que necessito de ocultar, amostrar e carregar, que suspeito que o jquery tem dificuldade em encontra-las e por isso queria utilizar o método (document) no jquery. eu uso assim para ocultar : $('#idCatOrigemProduto').hide(); como seria usando o método document? eu necessito tipo isto que dispara o click, $(document).on('click','#idCatOrigemProduto div',function(){
  5. Boas. É o primeiro tópico que crio. Estou a desenvolver o meu primeiro projecto web. É uma webpage dinâmica e responsiva em que uso jQuery e Bootstrap, e alguns efeitos parallax scrolling. Tenho uma <section> com background fixo que contem um título (<h2>) e texto com vários paragrafos (<p>). O que pretendo é que estes não estejam visíveis até que o utilizador faça scroll para essa secção. A animação deve ter um fade-in e mover-se de baixo para cima. Encontrei um JSFiddle que executa o fade-in: https://jsfiddle.net/tcloninger/e5qaD/ Tentei implementar no meu projecto, mas sem sucesso. O que poderei estar a fazer de errado? Obrigado. Aqui deixo o meu HTML: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="description" content=""> <meta name="author" content=""> <title>xxxxxxxx</title> <!-- Bootstrap Core CSS --> <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet"> <!-- Custom Fonts --> <link href="vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"> <link href="https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic" rel="stylesheet" type="text/css"> <link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css"> <!-- Theme CSS --> <link href="css/grayscale.css" rel="stylesheet"> </head> <body id="page-top" data-spy="scroll" data-target=".navbar-fixed-top"> <!-- Navigation --> <nav class="navbar navbar-custom navbar-fixed-top" role="navigation"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-main-collapse"> Menu <i class="fa fa-bars"></i> </button> <div class="navbar-brand page-scroll"> <a href="#page-top"> <span style="float:left;display: block;"> <img id="logo" src="img/small_140x146_EBP_logo.png"/> </span> <span id="brandname" style="float:left; display: block;"> <span>xxxxxx <span class="light">xxxxxxx</span> </span> <span class="clear-fix"></span> </a> </div> </div> <!-- Collect the nav links, forms, and other content for toggling --> <div class="collapse navbar-collapse navbar-right navbar-main-collapse"> <ul class="nav navbar-nav"> <!-- Hidden li included to remove active class from project link when scrolled up past project section --> <li class="hidden"> <a href="#page-top"></a> </li> <li> <a class="page-scroll hidden-sm" href="#project">Project</a> </li> <li> <a class="page-scroll" href="#news">News</a> </li> <li> <a class="page-scroll" href="#download">Download</a> </li> <li> <a class="page-scroll" href="#contact">Contact</a> </li> </ul> </div> <!-- /.navbar-collapse --> </div> <!-- /.container --> </nav> <!-- Intro Header --> <!-- background video whit letters on top --> <!-- responsive embed video --> <div class="embed-responsive embed-responsive-16by9"> <!-- header class with intro from bootstrap --> <header class="intro "> <!-- video tag, autoplayed with no loop and no sound --> <video preload="true" autoplay="autoplay" loop="loop" volume="0" poster="sources/videos/website_intro.png" style="opacity:0.7"> <source src="img/intro_web_temp.mp4" type="video/mp4"> <source src="img/intro_website.ogv" type="video/ogg"> <source src="img/intro_website.webm" type="video/webm"> </video> <!-- end of video --> <!-- here goes whatever you want to put on top of video --> <!-- container of text --> <div class="intro-text-container"> <!-- container of row from bootstrap --> <div class="row" style="margin-top: 42%"> <!-- another class of bootstrap for responsive text --> <div class="col-md-8 col-md-offset-2"> <a href="#project" class="btn btn-circle page-scroll"> <i class="fa fa-angle-double-down animated"></i> </a> </div> <!-- end of bootstrap's responsive text div --> </div> <!-- end of row --> </div> <!-- end of container of text --> </header> <!-- end of header --> </div> <!-- end of responsive embed video --> <!-- project Section --> <section id="project" class="container content-section text-center"> <div class="row"> <div class="col-lg-8 col-lg-offset-2"> <h2 class="hideme">Our Project</h2> <p class="hideme">xxxxxxxxxxxxxx<span class="highlight">best</span>xxxxxxxxxxx</p> <p class="hideme">xxxxxxxxxxx <span class="highlight">veterans</span> or <span class="highlight">xxxxxxxxxx</span> athletes.</p> <p class="hideme"><span class="highlight">xxxxxx</span>, <span class="highlight">xxxxxxxxxx</span>, xxxxxx <span class="highlight">xxxxxxxxxx</span> xxxxxxxxxxxx</p> <p class="hideme">xxxxxxxxxx<span class="highlight">xxxxxx</span>, <span class="highlight">skills</span>, <span class="highlight">xxxxxxxxx</span>xxxxxxxxx<span class="highlight">xxxxxxxxxxxxxxx <span class="highlight">better</span>.</p> </div> </div> </section> <section id="news"> <div id="carousel-example-generic" class="carousel carousel-fullscreen slide carousel-fade" data-ride="carousel" data-interval="4000" data-pause="null"> <!-- Indicators --> <ol class="carousel-indicators"> <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li> <li data-target="#carousel-example-generic" data-slide-to="1"></li> <li data-target="#carousel-example-generic" data-slide-to="2"></li> </ol> <!-- Wrapper for slides --> <div class="carousel-inner" role="listbox"> <div class="item active" style="background-image: url('img/nuno_fire_effect.png');"> <div class="overlay"></div> <div class="carousel-caption"> <h1 class="super-heading">Bootstrap Carousel Guide</h1> <p class="super-paragraph">This is a demo for the Bootstrap Carousel Guide by <a href="https://bootstrapious.com">Bootstrapious.com</a>.</p> </div> </div> <div class="item" style="background-image: url('img/dora_bg_in-game_benfica_sandstorm.png');"> <div class="overlay"></div> <div class="carousel-caption"> <h1 class="super-heading">Lorem ipsum dolor color</h1> <p class="super-paragraph">This is a demo for the Bootstrap Carousel Guide.</p> </div> </div> <div class="item" style="background-image: url('img/arnette_bg_sandstorm.png');"> <div class="overlay"></div> <div class="carousel-caption"> <h1 class="super-heading">Lorem ipsum dolor color</h1> <p class="super-paragraph">This is a demo for the Bootstrap Carousel Guide.</p> </div> </div> <!-- Controls --> <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"> <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> <span class="sr-only">Previous</span> </a> <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"> <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> <span class="sr-only">Next</span> </a> </div> </section> <!-- Download Section --> <section id="download" class="content-section text-center"> <div class="download-section"> <div class="container"> <div class="col-lg-8 col-lg-offset-2"> <h2>Download Grayscale</h2> <p>You can download Grayscale for free on the preview page at Start Bootstrap.</p> <a href="http://startbootstrap.com/template-overviews/grayscale/" class="btn btn-default btn-lg">Visit Download Page</a> </div> </div> </div> </section> <!-- Contact Section --> <section id="contact" class="container content-section text-center"> <div class="row"> <div class="col-lg-8 col-lg-offset-2"> <h2>Contact Start Bootstrap</h2> <p>Feel free to email us to provide some feedback on our templates, give us suggestions for new templates and themes, or to just say hello!</p> <p><a href="mailto:feedback@startbootstrap.com">feedback@startbootstrap.com</a> </p> <ul class="list-inline banner-social-buttons"> <li> <a href="https://twitter.com/SBootstrap" class="btn btn-default btn-lg"><i class="fa fa-twitter fa-fw"></i> <span class="network-name">Twitter</span></a> </li> <li> <a href="https://github.com/IronSummitMedia/startbootstrap" class="btn btn-default btn-lg"><i class="fa fa-github fa-fw"></i> <span class="network-name">Github</span></a> </li> <li> <a href="https://plus.google.com/+Startbootstrap/posts" class="btn btn-default btn-lg"><i class="fa fa-google-plus fa-fw"></i> <span class="network-name">Google+</span></a> </li> </ul> </div> </div> </section> <!-- Map Section --> <div id="map"></div> <!-- Footer --> <footer> <div class="container text-center"> <p>Copyright &copy; Your Website 2016</p> </div> </footer> <!-- jQuery --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>"></script> <!-- Bootstrap Core JavaScript --> <script src="vendor/bootstrap/js/bootstrap.min.js"></script> <!-- Plugin JavaScript --> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script> <!-- Google Maps API Key - Use your own API key to enable the map feature. More information on the Google Maps API can be found at https://developers.google.com/maps/ --> <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCRngKslUGJTlibkQ3FkfTxj3Xss1UlZDA&sensor=false"></script> <!-- Theme JavaScript --> <script src="js/grayscale.min.js"></script> </body> </html> Aqui o CSS: body { width: 100%; height: 100%; font-family: "Lora", "Helvetica Neue", Helvetica, Arial, sans-serif; color: white; background-color: black; } html { width: 100%; height: 100%; } h1, h2, h3, h4, h5, h6 { margin: 0 0 35px; text-transform: uppercase; font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: 700; letter-spacing: 1px; } p { margin: 0 0 25px; font-size: 18px; line-height: 1.5; } @media (min-width: 768px) { p { margin: 0 0 35px; font-size: 20px; line-height: 1.6; } } a { color: #42DCA3; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } a:hover, a:focus { text-decoration: none; color: #1d9b6c; } .light { font-weight: 400; } .navbar-custom { margin-bottom: 0; border-bottom: 1px solid rgba(255, 255, 255, 0.3); text-transform: uppercase; font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif; background-color: #111111; } .navbar-custom .navbar-toggle { color: white; background-color: rgba(255, 255, 255, 0.2); font-size: 12px; } .navbar-custom .navbar-toggle:focus, .navbar-custom .navbar-toggle:active { outline: none; } .navbar-custom .navbar-brand { font-weight: 700; } .navbar-custom .navbar-brand:focus { outline: none; } .navbar-custom a { color: white; } .navbar-custom .nav li a { -webkit-transition: background 0.3s ease-in-out; -moz-transition: background 0.3s ease-in-out; transition: background 0.3s ease-in-out; } .navbar-custom .nav li a:hover { color: rgba(255, 255, 255, 0.8); outline: none; background-color: transparent; } .navbar-custom .nav li a:focus, .navbar-custom .nav li a:active { outline: none; background-color: transparent; } .navbar-custom .nav li.active { outline: none; } .navbar-custom .nav li.active a { background-color: rgba(255, 255, 255, 0.3); } .navbar-fixed-top a{ margin-top: 10px; } @media (min-width: 768px) { .navbar-custom { padding: 20px 0; border-bottom: none; letter-spacing: 1px; background: transparent; -webkit-transition: background 0.5s ease-in-out, padding 0.5s ease-in-out; -moz-transition: background 0.5s ease-in-out, padding 0.5s ease-in-out; transition: background 0.5s ease-in-out, padding 0.5s ease-in-out; } .navbar-custom.top-nav-collapse { padding: 0; background: black; border-bottom: 1px solid rgba(255, 255, 255, 0.3); } } .intro { display: table; width: 100%; height: auto; padding: 100px 0; text-align: center; color: white; } .intro .intro-body { display: table-cell; vertical-align: middle; } .intro .intro-body .brand-heading { font-size: 40px; } .intro .intro-body .intro-text { font-size: 18px; } @media (min-width: 768px) { .intro { height: 100%; padding: 0; } .intro .intro-body .brand-heading { font-size: 100px; } .intro .intro-body .intro-text { font-size: 26px; } } .btn-circle { width: 40px; height: 40px; margin-top: -5%; padding: 0px 0px; border: 2px solid white; border-radius: 100% !important; font-size: 30px; color: white; background: transparent; -webkit-transition: background 0.3s ease-in-out; -moz-transition: background 0.3s ease-in-out; transition: background 0.3s ease-in-out; } .btn-circle:hover, .btn-circle:focus { outline: none; color: white; background: rgba(255, 255, 255, 0.1); } .btn-circle i.animated { -webkit-transition-property: -webkit-transform; -webkit-transition-duration: 1s; -moz-transition-property: -moz-transform; -moz-transition-duration: 1s; } .btn-circle:hover i.animated { -webkit-animation-name: pulse; -moz-animation-name: pulse; -webkit-animation-duration: 1.5s; -moz-animation-duration: 1.5s; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; } @-webkit-keyframes pulse { 0% { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.2); transform: scale(1.2); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @-moz-keyframes pulse { 0% { -moz-transform: scale(1); transform: scale(1); } 50% { -moz-transform: scale(1.2); transform: scale(1.2); } 100% { -moz-transform: scale(1); transform: scale(1); } } .content-section { padding-top: 100px; padding-bottom: 100px; } .download-section { width: 100%; padding: 50px 0; color: white; background: url(../img/downloads-bg.jpg) no-repeat center center scroll; background-color: black; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; -o-background-size: cover; } #map { width: 100%; height: 200px; margin-top: 100px; } @media (min-width: 767px) { .content-section { padding-top: 250px; } .download-section { padding: 100px 0; } #map { height: 400px; margin-top: 250px; } } .btn { text-transform: uppercase; font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: 400; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; border-radius: 0; } .btn-default { border: 1px solid #42DCA3; color: #42DCA3; background-color: transparent; } .btn-default:hover, .btn-default:focus { border: 1px solid #42DCA3; outline: none; color: black; background-color: #42DCA3; } ul.banner-social-buttons { margin-top: 0; } @media (max-width: 1199px) { ul.banner-social-buttons { margin-top: 15px; } } @media (max-width: 767px) { ul.banner-social-buttons li { display: block; margin-bottom: 20px; padding: 0; } ul.banner-social-buttons li:last-child { margin-bottom: 0; } } footer { padding: 50px 0; } footer p { margin: 0; } ::-moz-selection { text-shadow: none; background: #fcfcfc; background: rgba(255, 255, 255, 0.2); } ::selection { text-shadow: none; background: #fcfcfc; background: rgba(255, 255, 255, 0.2); } img::selection { background: transparent; } img::-moz-selection { background: transparent; } body { webkit-tap-highlight-color: rgba(255, 255, 255, 0.2); } .embed-responsive { height: 60%; width: 100%; } .embed-responsive-16by9 { top:-100px; } video { position: absolute; z-index: -1000; opacity: 0.8; width: 100%; overflow: hidden; } .clear-fix { clear: both !important; display: block !important; font-size: 0 !important; line-height: 0 !important; border: none !important; padding: 0 !important; margin: 0 !important; list-style: none !important; } #logo { height: 38px; width: 38px; margin-top:-17%; margin-left:-3%; margin-right:16%; transition: all 0.3s ease-in-out; } #brandname { margin-top: 2%; font-size: 20px; } .nav.navbar-nav li { margin-top: -1%; } .content-section { margin-top: -100px; } @media (min-width:1119px) { .embed-responsive { height: 100%; } .content-section { padding-top: 100px; margin-top: 0px; padding-bottom: 100px; } } @media (min-width:768px) { .navbar-custom.navbar-fixed-top.top-nav-collapse{ background-color: #111111; } .navbar-custom.navbar-fixed-top.top-nav-collapse #logo { height: 38px; width: 38px; margin-top:-17%; margin-left:-3%; margin-right:16%; transition: all 0.3s ease-in-out; } #logo { height: 82px; width: 80px; margin-top: -35%; margin-left: -20%; margin-right: 15%; transition: all 0.3s ease-in-out; } .embed-responsive { height: 85%; } .content-section { padding-top: 100px; margin-top: 100px; padding-bottom: 100px; } #download { padding-top: 0px; margin-top: 0px; } .btn-circle { width: 70px; height: 70px; margin-top: 15px; padding: 7px 16px; border: 2px solid white; border-radius: 100% !important; font-size: 40px; color: white; background: transparent; -webkit-transition: background 0.3s ease-in-out; -moz-transition: background 0.3s ease-in-out; transition: background 0.3s ease-in-out; } } .highlight { color: #42DCA3; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } #project { background-image: url("../img/elite_logo_small.png"); background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; } /* carousel fullscreen */ .carousel-fullscreen .carousel-inner .item { height: 100vh; min-height: 600px; background-position: center center; background-repeat: no-repeat; background-size: cover; } /* carousel fullscreen - vertically centered caption*/ .carousel-fullscreen .carousel-caption { top: 50%; bottom: auto; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); } .carousel-fade .carousel-inner .item { -webkit-transition-property: opacity; transition-property: opacity; } .carousel-fade .carousel-inner .item, .carousel-fade .carousel-inner .active.left, .carousel-fade .carousel-inner .active.right { opacity: 0; } .carousel-fade .carousel-inner .active, .carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right { opacity: 1; } .carousel-fade .carousel-inner .next, .carousel-fade .carousel-inner .prev, .carousel-fade .carousel-inner .active.left, .carousel-fade .carousel-inner .active.right { left: 0; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .carousel-fade .carousel-control { z-index: 2; } .overlay { position: absolute; width: 100%; height: 100%; background: #000; opacity: 0.3; transition: all 0.2s ease-out; } /* controls hidden except on hover */ .carousel .carousel-control { visibility: hidden; } .carousel:hover .carousel-control { visibility: visible; } .hideme { opacity:0; } Aqui o Javascript: // jQuery to collapse the navbar on scroll function collapseNavbar() { if ($(".navbar").offset().top > 50) { $(".navbar-fixed-top").addClass("top-nav-collapse"); } else { $(".navbar-fixed-top").removeClass("top-nav-collapse"); } } $(document).ready(function(){ $(window).scroll(function(){ collapseNavbar(); /* Check the location of each desired element */ $('.hideme').each( function(i){ var bottom_of_object = $(this).offset().top + $(this).outerHeight(); var bottom_of_window = $(window).scrollTop() + $(window).height(); /* If the object is completely visible in the window, fade it it */ if( bottom_of_window > bottom_of_object ){ $(this).animate({'opacity':'1'},500); } }); }); }); // jQuery for page scrolling feature - requires jQuery Easing plugin $(function() { $('a.page-scroll').bind('click', function(event) { var $anchor = $(this); $('html, body').stop().animate({ scrollTop: $($anchor.attr('href')).offset().top }, 1500, 'easeInOutExpo'); event.preventDefault(); }); }); // Closes the Responsive Menu on Menu Item Click $('.navbar-collapse ul li a').click(function() { $(this).closest('.collapse').collapse('toggle'); }); $('#carousel-example-generic').carousel({ interval: 3000, pause: null }) // Google Maps Scripts var map = null; // When the window has finished loading create our google map below google.maps.event.addDomListener(window, 'load', init); google.maps.event.addDomListener(window, 'resize', function() { map.setCenter(new google.maps.LatLng(40.6700, -73.9400)); }); function init() { // Basic options for a simple Google Map // For more options see: https://developers.google.com/maps/documentation/javascript/reference#MapOptions var mapOptions = { // How zoomed in you want the map to start at (always required) zoom: 15, // The latitude and longitude to center the map (always required) center: new google.maps.LatLng(40.6700, -73.9400), // New York // Disables the default Google Maps UI components disableDefaultUI: true, scrollwheel: false, draggable: false, // How you would like to style the map. // This is where you would paste any style found on Snazzy Maps. styles: [{ "featureType": "water", "elementType": "geometry", "stylers": [{ "color": "#000000" }, { "lightness": 17 }] }, { "featureType": "landscape", "elementType": "geometry", "stylers": [{ "color": "#000000" }, { "lightness": 20 }] }, { "featureType": "road.highway", "elementType": "geometry.fill", "stylers": [{ "color": "#000000" }, { "lightness": 17 }] }, { "featureType": "road.highway", "elementType": "geometry.stroke", "stylers": [{ "color": "#000000" }, { "lightness": 29 }, { "weight": 0.2 }] }, { "featureType": "road.arterial", "elementType": "geometry", "stylers": [{ "color": "#000000" }, { "lightness": 18 }] }, { "featureType": "road.local", "elementType": "geometry", "stylers": [{ "color": "#000000" }, { "lightness": 16 }] }, { "featureType": "poi", "elementType": "geometry", "stylers": [{ "color": "#000000" }, { "lightness": 21 }] }, { "elementType": "labels.text.stroke", "stylers": [{ "visibility": "on" }, { "color": "#000000" }, { "lightness": 16 }] }, { "elementType": "labels.text.fill", "stylers": [{ "saturation": 36 }, { "color": "#000000" }, { "lightness": 40 }] }, { "elementType": "labels.icon", "stylers": [{ "visibility": "off" }] }, { "featureType": "transit", "elementType": "geometry", "stylers": [{ "color": "#000000" }, { "lightness": 19 }] }, { "featureType": "administrative", "elementType": "geometry.fill", "stylers": [{ "color": "#000000" }, { "lightness": 20 }] }, { "featureType": "administrative", "elementType": "geometry.stroke", "stylers": [{ "color": "#000000" }, { "lightness": 17 }, { "weight": 1.2 }] }] }; // Get the HTML DOM element that will contain your map // We are using a div with id="map" seen below in the <body> var mapElement = document.getElementById('map'); // Create the Google Map using out element and options defined above map = new google.maps.Map(mapElement, mapOptions); // Custom Map Marker Icon - Customize the map-marker.png file to customize your icon var image = 'img/map-marker.png'; var myLatLng = new google.maps.LatLng(40.6700, -73.9400); var beachMarker = new google.maps.Marker({ position: myLatLng, map: map, icon: image }); }
  6. Olá estou com problemas para clicar no seguinte span <a class="ui-dialog-titlebar-close ui-corner-all" role="button" href="#" unselectable="on"> <span class="ui-icon ui-icon-closethick" unselectable="on">close</span></a> ele gera uma imagem de informativo que cobre a página principal e desabilita todos os campos e inputs da página e só libera depois dar o click nesse span acima. alguém sabe como posso fechar esse span via javascript/jquery?
  7. Gostaria de uma orientação. Em se tratando de formulários, post envio, qual seria a forma mais indicada para se trabalhar? Usando $.post $.post ("_required/email.php", { assunto : $("#assunto").val(), nome : $("#nome").val(), email : $("#email").val(), telefone : $("#telefone").val(), descricao : $("#descricao").val(), qual : $("#qual").val(), }, function(retorno){ if (retorno == "OK") { resposta = "E-mail enviado com sucesso!"; } else { resposta = "Erro no envio do E-mail"; } $(".resposta").css("display", "block"); $(".resposta").html(resposta); } ); Ou usando $.ajax $.ajax({ url: "_required/email.php", type: "POST", data: $("#contato").serialize(), success: function(retorno){ if (retorno == "OK") { resposta = "E-mail enviado com sucesso!"; } else { resposta = "Erro no envio do E-mail"; } $(".resposta").css("display", "block"); $(".resposta").html(resposta); } }); E porquê?
  8. Boas pessoal, Estou a implementar um dialog de login utilizando um JQuery dialog no entanto quando clico no botão Login não acontece nada. Pedia caso alguém pudesse que me ajudasse com esta questão. Código do dialogo: <script> $( function() { var dialog, form, name = $( "#name" ), email = $( "#email" ), password = $( "#password" ), allFields = $( [] ).add( name ).add( email ).add( password ); function loginUser() { var imgSrc = email; jQuery.ajax({ type: 'post', url:'admin/bd/login.php', data:{"imgSrc" : imgSrc}, dataType:'json', }); } dialog = $( "#dialog-form" ).dialog({ autoOpen: false, height: 400, width: 350, modal: true, buttons: { "Login": loginUser, Cancel: function() { dialog.dialog( "close" ); } }, close: function() { form[ 0 ].reset(); allFields.removeClass( "ui-state-error" ); } }); form = dialog.find( "form" ).on( "submit", function( event ) { event.preventDefault(); addUser(); }); $( "#login" ).button().on( "click", function() { dialog.dialog( "open" ); }); } ); </script> Na função loginUser faço um pedido AJAX que é responsável por chamar o ficheiro php passando-lhe os parâmetros. Estou a fazer um desenvolvimento usando o WAMP (não sei se tem influência).
  9. Bom dia pessoal, Preciso de uma pequena ajuda de vocês. Estou a elaborar um projecto que engloba routing de percurso rápido, e com as pesquisas que tenho feito encontrei uma ferramenta muito porreira até que é "leaflet-routing-machine" da OSRM. Só que o routing normal está a ser feito, indico os ponto de partida e de chegada mais os pontos intermédios e faz o percurso pela ordem que foi adicionado. Mas na realidade o que é necessário, é ter 5 pontos no mapa por exemplo por ordem sequencial, mas se colocar o marker de partida estar mais perto do segundo ponto, o mesmo deverá de assumir como o primeiro e o primeiro o segundo e que me calculasse a rota de seguida. Estive a ler mais sobre o plugin, e tem essa ferramenta, com o nome de "service trip" e já estive a fazer testes e alterar o código de maneira a que possa funcionar e não dá... Alguém ja utilizou este tipo de plugin's? Cumprimentos, Lisboeta
  10. bom dia gostaria me dessem um dica de como fazer isto: tenho uma admin onde os users tem acesso a varias coisas inclusive mensagens enviadas entre users o que queria fazer era: criar um ciclo que em cada vez que chegasse uma nova msg e o user tivesse logado aparecesse uma notificação a informar que tinha uma nova msg por ler. eu tenho assim <SCRIPT>$(document).ready(function(){ var temp= setInterval(update,6000); var Stacks = { stack_bar_top: { "dir1": "down", "dir2": "right", "push": "top", "spacing1": 0, "spacing2": 0 }, } function update (){ clearInterval(temp); var noteStack = "stack_bar_top"; var noteStyle= "warning"; var width = "290px"; $.ajax({ url:"entrada.php?page=60", type:"post" }).done(function (resposta){ var r="tem novas mensagens por ler"; if (resposta !=0){ new PNotify({ title: 'Mensagens', text: r, type: noteStyle, stack: Stacks[noteStack], width: "100%", delay: 3000 }); //var temp =setInterval(update,6000); } }) } }) </SCRIPT> a page=60 é um php <?php require_once '../connect.php';connect(); $comercial= mysql_query("SELECT * FROM comercial where email='".$_SESSION["user"]."' "); $comer= mysql_fetch_array($comercial); $msg= mysql_query ("SELECT * FROM msg_entrada where comercial_recetor=".$comer["id_comercial"]." and respondia =0"); $conta= mysql_num_rows($msg); echo $conta; ?>
  11. bom dia gostaria me dessem um dica de como fazer isto: tenho uma admin onde os users tem acesso a varias coisas inclusive mensagens enviadas entre users o que queria fazer era: criar um ciclo que em cada vez que chegasse uma nova msg e o user tivesse logado aparecesse uma notificação a informar que tinha uma nova msg por ler. eu tenho assim $(document).ready(function(){ var temp= setInterval(update,6000); var Stacks = { stack_bar_top: { "dir1": "down", "dir2": "right", "push": "top", "spacing1": 0, "spacing2": 0 }, } function update (){ clearInterval(temp); var noteStack = "stack_bar_top"; var noteStyle= "warning"; var width = "290px"; $.ajax({ url:"entrada.php?page=60", type:"post" }).done(function (resposta){ var r="tem novas mensagens por ler"; if (resposta !=0){ new PNotify({ title: 'Mensagens', text: r, type: noteStyle, stack: Stacks[noteStack], width: "100%", delay: 3000 }); //var temp =setInterval(update,6000); } }) } }) a page=60 é um php <?php require_once '../connect.php';connect(); $comercial= mysql_query("SELECT * FROM comercial where email='".$_SESSION["user"]."' "); $comer= mysql_fetch_array($comercial); $msg= mysql_query ("SELECT * FROM msg_entrada where comercial_recetor=".$comer["id_comercial"]." and respondia =0"); $conta= mysql_num_rows($msg); echo $conta; ?>
  12. boas estou aqui com uma duvida... tenho uma listagem <tr><td>/td><td></td></tr> o que quero fazer é um botao que ao carregar no tr abra a pagina da descrição do produto, mas ao clicar na ultimas td da tabela, se carregar na primeira td da tabela faz outra função tem como fazer isto? obrigado php '<tr class="message-unread" data-id="'.$passa["id_msg_enviadas"].'"> <td> <label class="option block mn"> <input id="apagar" name="apagar" value="1" type="checkbox"><span class="checkbox mn"></span> </label> </td> '; if ($u["id_tipo_users"]==1){ echo '<td>'.$emi["nome"].'</td>'; };echo' <td>'.$comerc["nome"].'</td> jquery $(document).ready(function (){ var user= "<?php echo $_GET["user"]; ?>"; $("tr").click(function (){ $(this).each(function(e){ for (var i = 0; i < this.attributes.length; i++) { var id=this.attributes["data-id"].value; $("#carregar").load("cnt/msg_enviadas.php?id="+id+"&user="+user); return false; } }); }); });
  13. Olá pessoal tenho um cadastro onde tenho inputs de valores e datas e consigo colocar máscaras de boa, mas tenho uma ação em que neste mesmo cadastro insiro inputs via ajax com jquery eles tem a mesma class dos outros inputs com máscara mas os inseridos via ajax, não recebem a máscara. Passei por uma situação semelhante pra pegar o click de um button inserido via ajax e consegui da seguinte maneira: jQuery(document).on( "click", ".registrar-usuario", function() { id_aluno = $(this).attr('data-id'); }); Mas como carregar as máscaras do input no caso acima? att,
  14. Boa tarde Tenho um questão. Tenho uma listagem de fotos e gostaria que ao arrastar uma para a frente da outra a ordem fosse alterada Eu tenho o efeito de arrastar feito...mas falta saber fazer a alteração da ordem. O output que está a dar é: $(document).ready (function (){ "use strict"; // Init Theme Core Core.init(); var last_touched = ''; var updateOutput = function(e){ var list = e.length ? e : $(e.target), output = list.data('output'); if (window.JSON) { output.val(window.JSON.stringify(list.nestable('serialize')));//, null, 2)); $.post('entrada.php?page=26', { 'whichnest' : last_touched, 'output' : output.val() }, function(data) { } ); } else { output.val('JSON browser support required for this demo.'); } }; //console.log(list.nestable('serialize')); // Init Nestable on list 1 $('#nestable').nestable().on('change', updateOutput); // nestable serialized output functionality updateOutput($('#nestable').data('output', $('#nestable-output'))); }) [{"id":2},{"id":1}] O meu PHP está assim: <textarea id="nestable-output" class="form-control"></textarea> <?php require_once("../connect.php");connect(); $imagens= mysql_query("SELECT * FROM imovel_imgs where id_imovel=".$_GET["id"].""); $contagem= mysql_num_rows($imagens); if ($contagem>0){ echo '<div class="ativo">'; }else { echo '<div class="resposta">'; } ?> <h4>Imagens Inseridas</h4><br> <div id="nestable" class="dd mb35"> <ol class="dd-list"> <?php while ($img= mysql_fetch_array($imagens)){ echo '<li data-id="'.$img["ordem"].'" class="dd-item"> <div class="dd-handle">ordem: '.$img["ordem"].'</div> <img src="./uploads/'.$img["file"].'" width="100px" class="data-dz-thumbnail" /> <br> <div class="btn-group"> <button style="padding:2px" type="button" onClick="apagar('.$img["id_imovel_imgs"].')" class="btn btn-danger btn-block-sm"><i class="fa fa-times"></i></button> </div> </li>'; } ?> </ol> </div>
  15. boas Qual o problema aqui do each? ele está-me a dar 2 resultados em vez de ser só um $(".dd-handle").each( function(e) { console.log(e); } o php esta assim (...) <?php while ($img= mysql_fetch_array($imagens)){ echo '<li data-id="'.$img["ordem"].'" class="dd-item"> <div class="dd-handle" data-ordem="'.$img["ordem"].'">ordem: '.$img["ordem"].'</div> <img src="./uploads/'.$img["file"].'" width="100px" class="data-dz-thumbnail" /> <br> <div class="btn-group"> <button style="padding:2px" type="button" onClick="apagar('.$img["id_imovel_imgs"].')" class="btn btn-danger btn-block-sm"><i class="fa fa-times"></i></button> </div> </li>'; } ?> obrigado
  16. O nosso cliente, Start-up tecnológica portuguesa, virada para o mundo do desporto, está a investir no crescimento da sua equipa de Programadores com vista ao desenvolvimento de ferramentas que auxiliem os treinadores a analisar o jogo de forma rápida e simples. Responsabilidades: As tarefas estarão orientadas para a atualização e desenvolvimento de novas funcionalidades do software, passando por sistemas de tempo real, comunicações API’s REST/Soap e integrações com outros sistemas. Requisitos & Qualificações: Experiência mínima de 4 anos em programação PHP; Experiência em HTML 5, CSS, Javascript; Experiência em MySQL e jQuery; Experiência com Frameworks MVC; Experiência com Source Control e em desenvolvimento de API’s REST e Soap. Valorizam-se os seguintes conhecimentos: AWS; NodeJs; Sistemas Unix (Ubuntu/Debian, etc); Teste e Q&A (Quality and Assurance). Condições Oferecidas: Pacote salarial adequado à experiência apresentada; Oportunidade de formação e desenvolvimento de carreira; Vínculo contratual estabelecido diretamente com o cliente. Se preenche os requisitos acima mencionados, por favor envie a sua candidatura através do e-mail: careers@quasarhumancapital.com com a Refª 20151202 – Programador Web/PHP (M/F).
  17. boa tarde estou aqui com uma duvida em usar o each tenho uma listagem onde cada linha ao carregar irá abrir uma pagina nova, cada linha tem um atributo associado gostaria que no jquery ao carregar nessa linha ele soubesse qual o atributo tenho feito assim $(msg).each(function(){ for (var i = 0; i < this.attributes.length; i++) { console.log(' Valor:' +this.attributes["data-id"].nodeValue); var id=this.attributes["data-id"].nodeValue; }; //return false; }); só que ele assim dá-me a listagem de todos os atributos, se coloco o return false ele só me dá o primeiro atributo... sei que está a faltar alguma forma de poder tirar deste each apenas o valo clicado obrigado desde já pela ajuda
  18. Boas malta. Estou com um pequeno problema ao criar uma dialog. O que se passa é o seguinte: tenho uma tabela em que num <td> tenho um <input> do tipo checkbox e quando se faz o check iria abrir o dialog com 3 botões: "Yes", "No", "Cancel", contudo estou com algumas dificuldades ao colocar o dialog em condições, visto que os botões não ficam com nome e não me aparece no centro do ecrã mas sim no canto superior esquerdo. o meu codigo está assim: PhP: <input type="checkbox" class="atividadesCheck" style="visibility:<?php echo $visibility_h2;?>" value="<?php echo $value ?>"/> <div id="txtAge" style="display: none;">Age is something</div> jQuery: $(document).ready(function () { $('.atividadesCheck').click(function () { if ($(this).is(':checked')) { $("#txtAge").dialog({ autoResize: true, modal: true, position: ['center', 'top'], draggable: false, buttons: { "Yes" : function() { } } }); } else { $("#txtAge").dialog('close'); } }); }); O resultado é isto: Alguma dica de como possa resolver? Fico a aguardar. Cumprimentos, Diogo
  19. Boas pessoal... tenho um problema... no site http://pcdev.site40.net/site/beta/ Tenho vários .js associados... E na barra de cima no "Tech Links" está um dropdown usando jquery (javascript) E dentro do portátil aparecem imagens... Tudo com javascript... E o problema é o seguinte se tenho o header nesta ordem <script src="js/jquery-1.6.3.min.js" type="text/javascript"></script> <script src="js/cufon-yui.js" type="text/javascript"></script> <script src="js/cufon-replace.js" type="text/javascript"></script> <script src="js/Mate_400.font.js" type="text/javascript"></script> <script src="js/FF-cash.js" type="text/javascript"></script> <script src="js/tms-0.3.js" type="text/javascript"></script> <script src="js/tms_presets.js" type="text/javascript"></script> <script src="js/jquery.easing.1.3.js" type="text/javascript"></script> <script type="text/javascript" src="js/jkmegamenu.js"></script> <script type="text/javascript"> //jkmegamenu.definemenu("anchorid", "menuid", "mouseover|click") jkmegamenu.definemenu("megaanchor", "megamenu1", "mouseover") </script> Não funciona o slideshow (as imagens que supostamente aparecem dentro do portátil) Se eu troco a ordem para esta <script type="text/javascript" src="js/jkmegamenu.js"></script> <script type="text/javascript"> //jkmegamenu.definemenu("anchorid", "menuid", "mouseover|click") jkmegamenu.definemenu("megaanchor", "megamenu1", "mouseover") </script> <script src="js/jquery-1.6.3.min.js" type="text/javascript"></script> <script src="js/cufon-yui.js" type="text/javascript"></script> <script src="js/cufon-replace.js" type="text/javascript"></script> <script src="js/Mate_400.font.js" type="text/javascript"></script> <script src="js/FF-cash.js" type="text/javascript"></script> <script src="js/tms-0.3.js" type="text/javascript"></script> <script src="js/tms_presets.js" type="text/javascript"></script> <script src="js/jquery.easing.1.3.js" type="text/javascript"></script> Não funciona o drop down... qual será o problema?
  20. Boas! Eu segui este exemplo https://jqueryui.com/dialog/#modal-form e criei uma janela modal. O que eu queria saber é, se é possível retirar barra que aparece a cinzento com o titulo e o botão de fechar.
  21. boas eu tenho um for no meu php para ele acrescentar números a uma listagem for ($i = 30000 ; $i <= 175000; $i=$i+20000) { echo '<li data-valor="'.$i.'">'.$i.'€</li>'; } mas quando tento ir buscar os valores por jquery, este dá-me sempre o mesmo valor 30000 em todos $("#euros li").click(function (){ var euro =$("#euros li").attr("data-valor"); $(".min").val(euro); }); alguém me pode dar uma "luz" obrigado
  22. Boa noite, Estou praqui a tentar enviar um valor para um ficheiro php, e receber resposta desse mesmo ficheiro, isso automaticamente. Mas algo esta a correr mal. Eu sou iniciante nesta area e tou com alguma dificuldade. Alguem por favor me consegue ajudar? Deixo em baixo o codigo jquery, esta alguma coisa nele mal que esta a bloquear o funcionamento total do site. <script> $(document).ready(function() { var myLast = 'sendlast='+ $("#send_total").val(); var auto_refresh = setInterval( jQuery.ajax({ type: "POST", url: "auto_load_news.php", dataType:"text", data:myLast, success:function () { $('#have_news').load('auto_load_news.php').show("slow"); }, error:function (xhr, ajaxOptions, thrownError){ alert(thrownError); } }), 2000); }); </script> <?php include("config.php"); if(isset($_POST["sendlast"])) { $last = filter_var($_POST["sendlast"], FILTER_SANITIZE_NUMBER_INT, FILTER_FLAG_STRIP_HIGH); $result = $mysqli->prepare("SELECT idpost FROM post ORDER BY idpost DESC LIMIT 1"); $result->execute(); //Execute prepared Query $result->bind_result($idposta); //bind variables to prepared statement while($result->fetch()){ if($idposta > $last){ echo "Existem novos posts"; } else{ } } } ?>
  23. Boa tarde, precisava da vossa ajuda, tenho uma pequena aplicação onde tenho varios clientes numa BD, com as respetivas coordenadas e o tipo de cliente. o que pretendo é criar filtros por tipo de cliente. ex. todos os clientes do tipo x ou do tipo y. ja estive a procurar na net. mas tambem não fiquei muito esclarecido da forma como fazer. percebi como fazer apartir de um array fixo. mas de uma bd nao. alguem tem algum exemplo mais concreto ? nao sei se me estou a explicar bem. alguma duvida perguntem.
  24. Boa tarde pessoal, Estou com uma dúvidas em relação a um formulário de contacto, pois estive a ver e ele ao que parece recorre a ajax, enviando os dados em json para uma página de tratamento ao qual não tenho acesso. A minha ideia era fazer um mesmo para um projecto, mas como nunca tive ajax e json não sei utilizar. Se fosse possível explicar como funciona agradecia, deixo aqui algum excerto do código em questão. Formulário: <form id="contact-form" role="form"> <div class="ajax-hidden"> <div class="form-group"> <label class="sr-only" for="c_name">Nome</label> <input type="text" id="c_name" class="form-control" name="c_name" placeholder="Nome"> </div> <div class="form-group"> <label class="sr-only" for="c_email">E-mail</label> <input type="email" id="c_email" class="form-control" name="c_email" placeholder="E-mail"> </div> <div class="form-group"> <textarea class="form-control" id="c_message" name="c_message" rows="7" placeholder="Sua mensagem..."><textarea> </div> <button type="submit" class="btn btn-custom-1-inverse"> <i class="fa fa-send icon-before"></i> Enviar </button> </div> <div class="ajax-response"></div><!-- Displays status when submitting form --> </form> Ficheiro custom.js onde se encontra penso eu a validação deste formulário e envio dos dados para à página de tratamento: /* ---------------------------------------------- /* * Contact form ajax /* ---------------------------------------------- */ $("#contact-form").submit(function(e) { e.preventDefault(); var c_name = $("#c_name").val(); var c_email = $("#c_email").val(); var c_message = $("#c_message ").val(); var responseMessage = $('#contact-form .ajax-response'); if (( c_name== "" || c_email == "" || c_message == "") || (!isValidEmailAddress(c_email) )) { responseMessage.fadeIn(500); responseMessage.html('<i class="fa fa-warning"></i> Preencha todos os campos!'); } else { $.ajax({ type: "POST", url:"../assets/php/ContactForm.php", dataType: 'json', data: { c_email: c_email, c_name: c_name, c_message: c_message }, beforeSend: function(result) { $('#contact-form button').empty(); $('#contact-form button').append('<i class="fa fa-cog fa-spin"></i> Aguarde'); }, success: function(result) { if(result.sendstatus == 1) { $('#contact-form .ajax-hidden').fadeOut(500); responseMessage.html(result.message).fadeIn(500); } else { $('#contact-form button').empty(); $('#contact-form button').append('<i class="fa fa-retweet"></i> Tente Novamente!'); responseMessage.html(result.message).fadeIn(1000); } } }); } return false; }); Será que alguém me pode ajudar nisto? Gostaria de saber como funciona e como depois no ficheiro que não tenho acesso se pega os dados e fazer o tratamento deles. Desde já obrigado.
  25. tenho o seguinte código: <select> <optgroup label="fruta"> <option value="banana">banana</option> <option value="uva">uva</option> </optgroup> <optgroup label="legume"> <option value="batata">batata</option> <option value="cenoura">cenoura</option> </optgroup> </select> <div id="label_value"></div> Gostaria em JQuery pegar o valor do label e value e jogar numa div.