Jump to content
  • ×   Pasted as rich text.   Paste as plain text instead

      Only 75 emoji are allowed.

    ×   Your link has been automatically embedded.   Display as a link instead

    ×   Your previous content has been restored.   Clear editor

    ×   You cannot paste images directly. Upload or insert images from URL.

  • Similar Content

    • By fbern
      bonjour
      question de débutant sûrement, mais lorsque que l'on fait un site en responsive, comment google peut detecter que le site est compatible avec les devices, faut-il lui indiquer quelque chose en particulier ?
      merci
    • By Elnin
      Bonjour, je suis musicien et je commence à coder mon propre site, car il se trouve que, comme la plupart d'entre vous, j'adore coder (bref).
      En tous cas, je viens de terminer la maquette du design, et il se trouve que suis incompétent à réaliser certaines bases du site...
      Il se trouve que j'aimerais séparer (en gros) la page web en deux, avec une grande ligne diagonale. Dans un vieux tutoriel, j'avais lu qu'en Javascript, l'on pouvait dessiner tout ce qu'on voulait sur des calques avec canvas... Problème : je n'ai que quelques bases en Javascript qui ne me permettront surement pas d'atteindre mon objectif. Je sollicite donc votre aide pour m'indiquer ne serait-ce qu'un lien ou ce que j'aimerais réaliser est expliqué ou si vous connaissez certaines balises...
      Merci d'avance,
      Elnin
    • By dav3net
      Bonjour,

      Contexte : Utilisation d'un script d'annuaire en PHP MySQL avec un affichage d'une carte via API Gmaps et des coordonnées contenu dans une des table de la bd MySQL.

      Pour cela j'ai suivi le tuto google pour afficher la carte suite à une génération d'une sortie au format KML/XML par un script PHP,
      je vous laisse découvrir : https://developers.google.com/maps/articles/phpsqlajax_v3

      Le code pour l'affichage de la carte est celui-ci :
      <!DOCTYPE html > <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> <title>PHP/MySQL & Google Maps Example</title> <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js"></script> <script type="text/javascript"> //<![CDATA[ var customIcons = { restaurant: { icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png' }, bar: { icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png' } }; function load() { var map = new google.maps.Map(document.getElementById("map"), { center: new google.maps.LatLng(47.6145, -122.3418), zoom: 13, mapTypeId: 'roadmap' }); var infoWindow = new google.maps.InfoWindow; // Change this depending on the name of your PHP file downloadUrl("phpsqlajax_genxml.php", function(data) { var xml = data.responseXML; var markers = xml.documentElement.getElementsByTagName("marker"); for (var i = 0; i < markers.length; i++) { var name = markers[i].getAttribute("name"); var address = markers[i].getAttribute("address"); var type = markers[i].getAttribute("type"); var point = new google.maps.LatLng( parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng"))); var html = "<b>" + name + "</b> <br/>" + address; var icon = customIcons[type] || {}; var marker = new google.maps.Marker({ map: map, position: point, icon: icon.icon }); bindInfoWindow(marker, map, infoWindow, html); } }); } function bindInfoWindow(marker, map, infoWindow, html) { google.maps.event.addListener(marker, 'click', function() { infoWindow.setContent(html); infoWindow.open(map, marker); }); } function downloadUrl(url, callback) { var request = window.ActiveXObject ? new ActiveXObject('Microsoft.XMLHTTP') : new XMLHttpRequest; request.onreadystatechange = function() { if (request.readyState == 4) { request.onreadystatechange = doNothing; callback(request, request.status); } }; request.open('GET', url, true); request.send(null); } function doNothing() {} //]]> </script> </head> <body onload="load()"> <div id="map" style="width: 500px; height: 300px"></div> </body> </html> Je souhaiterais que les markers soit regroupés sous forme de clusters, j'ai trouvé la solution ici :
      https://developers.google.com/maps/a...arkerclusterer
      Les sources sur GitHUB
      et plus d'exemples https://googlemaps.github.io/js-mark.../examples.html

      Bref, en gros je pense qu'il faut intégrer le code suivant au précédent :
      var center = new google.maps.LatLng(37.4419, -122.1419);var options = {'zoom': 13,'center': center,'mapTypeId': google.maps.MapTypeId.ROADMAP};var map = new google.maps.Map(document.getElementById("map"), options);var markers = [];for (var i = 0; i < 100; i++) {var latLng = new google.maps.LatLng(data.photos[i].latitude,data.photos[i].longitude);var marker = new google.maps.Marker({'position': latLng});markers.push(marker);}var markerCluster = new MarkerClusterer(map, markers); Je ne maîtrise pas le JavaScript, et je n'arrive pas à compiler les deux fonctions... De l'aide serait la bienvenue.. Merci d'avance !
    • By hoev
      Bonjour,

      A partir de tutoriaux, j'ai élaboré le menu déroulant suivant sur mon site:
      http://www.huiledolivedespagne.fr/

      Mais, il utilise, de façon impropre apparemment (selon w3c), les balises dl,dt,dd. et cela ne marche pas sur Safari (mais sur IE, google et mozilla si).
      J'essaye donc de le refaire, simplement avec des ul li ul li (des listes classiques).
      Or je me mélange les pédales et m'y perds dans la définition des propriétés des balises.

      OBJECTIF: Retrouver avec des ul li ul li ce que j'ai réussi à faire avec dl,dt,dd sur le site http://www.huiledolivedespagne.fr/

      Je souhaitais que le texte des menus et sous-menus apparaissent en gris noir toujours et sans soulignement jamais.
      Je souhaitais aussi, qu'au touché avec le curseur de la souris, le rectangle autour du texte apparaisse en jaune clair et que les textes avec liens (seulement ceux qui ont des liens) la police apparaisse en rouge (ceux sans liens restent gris noir).

      Enfin, je souhaitais que, pour le menu, le fait d'avoir déjà clicqué sur un lien ne modifie pas l'apparence des textes dans les menus après. Ils restent gris noirs et changent seulement s'il y a un lien quand le cursor de la souris le touche. (voir comment cela fonction actuellement sur le site huiledolivedespagne.fr)

      Définition du Menu: Code html actuel (dl,dt,dd):

      <nav><div id="menu"><dl><dt><a href="index.html">ACCUEIL</a></dt></dl><dl><dt>ZONES DE PRODUCTION</dt><dd><ul><li><a href="geographique.html">Répartition géographique</a></li><li><a href="AOP.html">Carte des variétés et AOPs</a></li><li><a href="poids.html">Poids des variétés</a></li></ul></dd></dl><dl><dt>VARIÉTÉS D'OLIVE</dt><dd><ul><li><a href="picual.html">Picual</a></li><li><a href="cornicabra.html">Cornicabra</a></li><li><a href="hojiblanca.html">Hojiblanca</a></li><li><a href="picudo.html">Picudo</a></li><li><a href="arbequina.html">Arbequina</a></li><li><a href="empeltre.html">Empeltre</a></li></ul></dd></dl><dl><dt>RECETTES</dt><dd><ul><li><a href="cuisineethuile.html">Une huile pour chaque plat</a></li><li><a href="papillotes.html">Papillotes de Loup</a></li><li><a href="filetmignon.html">Filet Mignon Ibérique</a></li><li><a href="glacehuiledolive.html">Glace à l'huile d'olive</a></li></ul></dd></dl><p><br/></p></div> </nav>

      Définition du Menu: Objectif code HTML (ul,li):

      <nav> <div id="menu"> <ul> <li><a href="index.html">ACCUEIL</a></li> <li>ZONES DE PRODUCTION <ul> <li><a href="geographique.html">Répartition géographique</a></li> <li><a href="AOP.html">Carte des variétés et AOPs</a></li> <li><a href="poids.html">Poids des variétés</a></li> </ul> </li> <li>VARIÉTÉS D'OLIVE <ul> <li><a href="picual.html">Picual</a></li> <li><a href="cornicabra.html">Cornicabra</a></li> <li><a href="hojiblanca.html">Hojiblanca</a></li> <li><a href="picudo.html">Picudo</a></li> <li><a href="arbequina.html">Arbequina</a></li> <li><a href="empeltre.html">Empeltre</a></li> </ul> </li> <li>RECETTES</li> <ul> <li><a href="cuisineethuile.html">Une huile pour chaque plat</a></li> <li><a href="papillotes.html">Papillotes de Loup</a></li> <li><a href="filetmignon.html">Filet Mignon Ibérique</a></li> <li><a href="glacehuiledolive.html">Glace à l'huile d'olive</a></li> </ul> </li> </ul> <p><br/></p> </div> </nav>
      Définition du Menu: CSS actuel:

      /* Navigation *//* MENU */#menu { text-decoration: none; list-style: none; margin: 0px auto; padding: 0px; width: 57em; height: 40px; text-align: center; text-transform: none; font-family: "Trebuchet MS", Arial; font-weight: bold; display: block; position: relative; z-index: 7;}dl { background: white; margin: 0px; padding: 0px; float: left; display: block;}dt { margin: 0px; padding: 0px; width: 14em; height: 40px; text-align: center; color: rgb(24, 24, 24); line-height: 40px; font-weight: bold; cursor: pointer;}dt a { text-decoration: none; margin: 0px; padding: 0px; text-align: center; color: rgb(24, 24, 24); font-weight: bold; text-decoration: none;}dt:hover { text-decoration: none; background: rgb(255, 255, 196); color: rgb(24, 24, 24);}dt a:hover { text-decoration: none; background: rgb(255, 255, 196); color: rgb(255, 15, 15);}dt:visited,dt a:visited { text-decoration: none; color: rgb(24, 24, 24);}/* sous-menus */dd { background: rgb(255, 255, 196); margin: 0px; padding: 0px; display: block; z-index: 7;font-weight: normal;}dd ul { background: white; margin: 0px; padding: 0px; width: 14em; height: 30px; text-align: center; line-height: 30px; display: block; z-index: 7;}dd ul li { background: white; margin: 0px; padding: 0px; display: block; z-index: 7;}dd ul li a { text-decoration: none; width: 14em; height: 30px; color: rgb(24, 24, 24); line-height: 30px; display: block; z-index: 7;}dd ul li a:hover { text-decoration: none; background: rgb(255, 255, 196); color: rgb(255, 15, 15); z-index: 7;}dd ul li a:visited { text-decoration: none; color: rgb(24, 24, 24); z-index: 7;}dl dd { display: none;}dl:hover dd { display: block;}

      Je voudrais pouvoir adapter ce CSS au html avec seulement ul et li et obtenir le même résultat.
      Je n'y arrive pas.
      Je m'emmêle les pédales avec les ul li ul li.
      J'ai aussi essayé avec des classes menu, sous-menu, menu-item, sous-menu-item.
      Je n'y arrive pas non plus.

      Quelqu'un peut-il me donner un coup de main, SVP?
      Merci d'avance...
×
×
  • Create New...