Aller au contenu

truitas

Actif
 Afficher le profil  Parcourir son contenu

  • Compteur de contenus

    37

  • Inscrit(e) le

  • Dernière visite

Réputation sur la communauté

0 Neutre

Pour me contacter

  • Mon Site
    http://savoie-rando.fr
  1. truitas
    merci pour vos réponses, ca a avancé grâce aux idées que vous m'avez données, c'est bien positionné après je ne sais pas si c'est très juste, qu' en pensez-vous?: a l'intérieur de ma div content située dans la div wrapper j'ai ajouté: <aside class="decodroit"> <section class="decodroit"> </section> </aside> <aside class="decogauche"> <section class="decogauche"> </section> </aside> mon CSS .content .decodroit { background:url(img/bg1.png) repeat-y; right:-25%; height:100%; } .content .decogauche { background:url(img/bg1.png) repeat-y; height: 100%; left:-12.7%; }
  2. truitas
    Bonjour à tous, je tente de refaire complètement mon site en html5 et ccs3. Mon site est entièrement fluide je veux placer une image répétée en bordure extérieure de ma page gauche et droite. j'ai essayé sur le body en remplaçant right et left par des % mais en cas de redimensionnement de la page la bordure se retrouve soit trop loin soit trop près disparait sous le corps de la page. body { font-size: 68%; background:url(img/REEL_env_img_footer_1_1313510375.jpg) repeat-y right, url(img/REEL_env_img_footer2.jpg) repeat-y left; } } J'ai essayé sur ma div wrapper mais l'image est donc à l'intérieur du corps de page .wrapper { width: 100%; max-width: 1100px; border: 0 solid rgba(0,0,0,.46); border-width: 0 8px; margin: 0 auto; background:url(img/REEL_env_img_footer3.png) repeat-y right, url(img/REEL_env_img_footer2.jpg) repeat-y left; -moz-box-shadow: 0 0 12px 2px rgba(0,0,0,.2); -webkit-box-shadow: 0 0 12px 2px rgba(0,0,0,.2); box-shadow: 0 0 12px 2px rgba(0,0,0,.2); } } Pouvez-vous m'aider? merci yan
  3. truitas
    Bonjour, je ne sais pas si cela pourra t'aider mais voici une générateur de bouton CSS3; Il suffit de faire varier les états normal state, hover state et tu devrais arriver à tes fins. (plus besoin d'image et un peu plus rapide) http://dryicons.com/demos/css3-linear-gradient-buttons-generator/ amicalement yan
  4. truitas
    bonjour, tu as juste a faire un clique droit> code source de la page; et tu auras tout le nécessaire... amicalement yan
  5. truitas
    bonjour et merci tomyweb, le site que tu recommandes et que j'avais mis en lien ne propose pas la compatibilité pour les différentes versions des navigateurs. J'ai utilisé:http://www.colorzilla.com/gradient-editor/ En plus de css-please mis dans le post précédent 2 sites excellents: http://www.css3files.com/ Générateur de box très complet: http://css3.mikeplate.com/
  6. truitas
    merci beaucoup, on ne sais jamais si ca peut servir quelques liens vers des générateurs css permettant de travailler les gradient, shadow, les box etc: http://css3please.com/" http://www.impressivewebs.com/css3-click-chart/" http://westciv.com/tools/" http://www.display-inline.fr/projects/css-gradient/" http://gradients.glrzad.com/" http://www.colorzilla.com/gradient-editor/" http://www.css3files.com/gradient/"
  7. truitas
    bonjour à tous, j'ai in problème d'affichage de ma couleur de background en dégradé: Sous firefox et chrome au lieu d'avoir un dégradé de haut en bas j ai une succession de lignes dégradées. Sous IE 9 cela ne fonctionne pas. Avez vous une solution? merci <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title></title> </head> <body> <style type="text/css"> body{ background: #a1dbff; /* Old browsers */ background: -moz-linear-gradient(top, #a1dbff 0%, #cbebff 53%, #f0f9ff 100%);/* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a1dbff), color-stop(53%,#cbebff), color-stop(100%,#f0f9ff)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #a1dbff 0%,#cbebff 53%,#f0f9ff 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #a1dbff 0%,#cbebff 53%,#f0f9ff 100%); /* Opera11.10+ */ background: -ms-linear-gradient(top, #a1dbff 0%,#cbebff 53%,#f0f9ff 100%); /* IE10+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a1dbff', endColorstr='#f0f9ff',GradientType=0 ); /* IE6-9 */ background: linear-gradient(top, #a1dbff 0%,#cbebff 53%,#f0f9ff 100%); /* W3C */ } </style> </body> </html>
  8. truitas
    Merci, je viens de tester ca marche parfaitement. pour ceux que ca intéresse je mets quelques liens vers des animations du même type: http://web.enavu.com/demos/dual_sliding_door/ http://web.enavu.com/demos/thumbnailZoom/ http://www.queness.com/resources/html/bar/index.html http://www.queness.com/resources/html/thumbnail/index.html http://web.enavu.com/demos/sliding_door/ Avant/après: http://www.queness.com/post/6480/create-an-attractive-before-and-after-photo-effect-with-jquery
  9. truitas
    Bonjour à tous, j'ai trouvé une animation sur image qui m'intéresse fortement: http://www.queness.com/post/620/create-a-stunning-sliding-door-effect-with-jquery Demo: http://www.queness.com/resources/html/slicing/index.html Par contre, je n'arrive pas à obtenir une position centrée sur ma page. Quels sont les éléments à modifier dans le CSS ? merci d'avance. Code HTML: <div class="qitem"> <a href="http://www.google.com"><img src="1.gif" alt="Test 1" title="" width="126" height="126"/></a> <span class="caption"><h4>Night Club</h4><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p></span> </div> CSS body { font-family:arial; } .qitem { /* width and height must be even number */ width:126px; height:126px; /* some styling for the item */ border:4px solid #222; margin:5px 5px 5px 0; background: url('bg.gif') no-repeat; /* make sure the four divs are hidden after changing the position */ overflow:hidden; /* absolute position enabled for children elements*/ position:relative; /* display item in single row */ float:left; /* hand symbol for ie and other browser */ cursor:hand; cursor:pointer; } .qitem img { border:0; } /* styling for caption, position absolute is a must to set the z-index */ .qitem .caption { position:absolute; z-index:0; color:#ccc; display:block; } .qitem .caption h4 { font-size:12px; padding:10px 5px 0 8px; margin:0; color:#369ead; } .qitem .caption p { font-size:10px; padding:3px 5px 0 8px; margin:0; } /* Generic setting for corners */ .topLeft, .topRight, .bottomLeft, .bottomRight { /* allow javascript to move the corners */ position:absolute; background-repeat: no-repeat; z-index:200; } /* set the background position for different corners */ .topLeft { background-position: top left; } .topRight { background-position: top right; } .bottomLeft { background-position: bottom left; } .bottomRight { background-position: bottom right; } .clear { clear:both; } Javascript: $(document).ready(function() { //Custom settings var style_in = 'easeOutBounce'; var style_out = 'jswing'; var speed_in = 1000; var speed_out = 300; //Calculation for corners var neg = Math.round($('.qitem').width() / 2) * (-1); var pos = neg * (-1); var out = pos * 2; $('.qitem').each(function () { //grab the anchor and image path url = $(this).find('a').attr('href'); img = $(this).find('img').attr('src'); //remove the image $('img', this).remove(); //append four corners/divs into it $(this).append('<div class="topLeft"></div><div class="topRight"></div><div class="bottomLeft"></div><div class="bottomRight"></div>'); //set the background image to all the corners $(this).children('div').css('background-image','url('+ img + ')'); //set the position of corners $(this).find('div.topLeft').css({top:0, left:0, width:pos , height:pos}); $(this).find('div.topRight').css({top:0, left:pos, width:pos , height:pos}); $(this).find('div.bottomLeft').css({bottom:0, left:0, width:pos , height:pos}); $(this).find('div.bottomRight').css({bottom:0, left:pos, width:pos , height:pos}); }).hover(function () { //animate the position $(this).find('div.topLeft').stop(false, true).animate({top:neg, left:neg}, {duration:speed_out, easing:style_out}); $(this).find('div.topRight').stop(false, true).animate({top:neg, left:out}, {duration:speed_out, easing:style_out}); $(this).find('div.bottomLeft').stop(false, true).animate({bottom:neg, left:neg}, {duration:speed_out, easing:style_out}); $(this).find('div.bottomRight').stop(false, true).animate({bottom:neg, left:out}, {duration:speed_out, easing:style_out}); }, function () { //put corners back to the original position $(this).find('div.topLeft').stop(false, true).animate({top:0, left:0}, {duration:speed_in, easing:style_in}); $(this).find('div.topRight').stop(false, true).animate({top:0, left:pos}, {duration:speed_in, easing:style_in}); $(this).find('div.bottomLeft').stop(false, true).animate({bottom:0, left:0}, {duration:speed_in, easing:style_in}); $(this).find('div.bottomRight').stop(false, true).animate({bottom:0, left:pos}, {duration:speed_in, easing:style_in}); }).click (function () { //go to the url window.location = $(this).find('a').attr('href'); }); });
  10. truitas
    merci big
  11. truitas
    Bonjour à tous, le site bostom .com propose une partie photo reportage avec des clichés grand format. Vous pourrez les voir ici: Mon lien Cliquer sur une photo pour voir la série. S'il on prend la série sur Ratko Mladic. Je vous mets le poids des 10 premières en Ko: 532+682+809+471+862+572+582+728+667+567 Il y en a 41 en tout. Quel procédé utilisent-ils pour que des photos aussi grandes se chargent aussi vite? merci d'avance.
  12. truitas
    Bonjour à tous, vous trouverez ci-dessous quelques liens qui me semblent intéressants pour l'intégration de carte google map ou autre sur un site. J'espère que cela vous sera utile et que j'ai posté au bon endroit: *Map slider : http://css-tricks.com/google-maps-slider/ > explorer ce site, beaucoup de tools en css et jquery ex: -http://hitotoki.org/places/japan/tokyo/ -http://widmerbrothers.com/find-beer/#beer > explorer ce site assez original -http://jaxvineyards.com/#/stockists.html -http://albertyung.com/MyTravel/20100918/ *Autre plugin jquery -http://www.gethifi.com/blog/a-jquery-plugin-for-zoomable-interactive-maps#demos -http://www.mayzes.org/googlemaps.jquery.html > voir les différentes démos en bas -http://www.blocsoft.com/bmap/examples.asp -http://gmap3.touraineverte.com/index.html *A voir: -http://www.topomap.co.nz/ -http://cartographer.visualmotive.com/ -http://www.cssplay.co.uk/menu/mapper.html amicalement
  13. truitas
    salut merci pour ta tentative de réponse: mais je veux juste ajouter une ligne au code que je t'ai mis afin d'avoir les informations sur le volume de transaction. La ligne que je voudrais ajouter ressemblerait à ca (je bloque sur les expressions régulières concernant le volume: <syndication name="action_vol(euronext)" parent="cotation(euronext)"> <masks> <mask value=" volume:{volum}" blinking="0" color=""/> </masks> <patterns> <pattern name="volum" value="volume:</td>[ \t\r\n]*<td[ \t\r\n]*colspan="\d+"[ \t\r\n]*class="([\w]+)">[ \t\r\n]*\d+,\d+,\d+[ \t\r\n]*" /> </patterns> </syndication>
  14. truitas

    regex recuperer infos pages

    truitas a ajouté un sujet dans PHP

    Bonjour à tous je ne suis pas sur d'être au bon endroit, j'utilise un petit programme qui permet d'afficher les cours de bourse de valeurs sélectionnées sur un bandeau défilant en haut de l'écran. source du programme: http://boursi.scroller.moult.org/ Il fonctionne avec des flux de syndication, on rentre le code d'identification d'une action dans le programme et il va chercher les informations sur une page web. Si j'avais entré par exemple le code de l'action natixis = FR0000120685, le programme serait aller extraire des infos sur la page suivante: =http://www.euronext.com/trader/summarizedmarket/stocks-2593-EN-FR0000120685.html?selectedMep=1 Mon problème: j'aimerais ajouter au flux de syndication (.sxml) des lignes permettant d'aller récupérer les informations sur le volume de transaction (tableau market data) Pouvez-vous m'aider? code du flux: <syndications> <syndication name="cotation (euronext)" url="http://www.euronext.com/trader/summarizedmarket/stocks-2593-EN-{code}.html?selectedMep=1" username="" password="" culture="en-US"> <masks> <mask value="{name} {value}{currency}" blinking="0" color=""/> </masks> <patterns> <pattern name="value" value="LAST_PRICE">(\d+[\,]*\d*.\d+)</span><" /> </patterns> </syndication> <syndication name="indice (euronext)" parent="cotation (euronext)"> <masks> <mask value="{variation_day}" image="default" index="0"/> <mask value="({variation_day}%)" blinking="0" color="variation_day"/> </masks> <patterns> <pattern name="variation_day" value="RELATIVE_DIFFERENCE">([\+\-]+\d*.\d+)%</span><" /> </patterns> </syndication> <syndication name="action (euronext)" parent="indice (euronext)"> <masks> <mask value="({my_variation}%)" blinking="0" color="my_variation" /> <mask value="{my_gain}{currency}" blinking="1" color="my_gain" /> </masks> </syndication> <syndication name="action+ (euronext)" parent="action (euronext)"> <masks> <mask value="{my_variation}" image="default" index="4"/> </masks> </syndication> </syndications> merci d'avoir lu jusqu'au bout. bien cordialement yannick
  15. truitas
    bonjour a tous, je voudrais installer sur mon site (html) un moteur de recherche ne passant pas par une base de donnée. Le moteur ferait apparaître les résultats dans la page sur laquelle il se situe. Cela existe il? merci pour vos réponses.
×
×
  • Créer...