mercredi 8 mai 2013

Simple way to play sound onMouseover event

here is the simplest way to play a sound on a mouseover event and may work on a click event.
Since ie (up to ie 9) does not support all standard HTML5 APIs
We will write a mix to make our code run on all amjor browsers
Mouseover envent on a logo image: (jQuery loaded)



<script language="javascript" type="text/javascript">
jQuery(document).ready(function() {
  jQuery("#website-logo").hover(function() {
  if (jQuery.browser.msie) { /* For ie*/
    document.all.sound.src = '/sounds/dog.wav';
  } else /*Other browsers*/
playSound('/sounds/dog.wav');
  });
});
 function playSound(soundfile) {
var snd = new Audio(soundfile);/*HTML5 Api */
snd.play();
 }
 </script>

<bgsound id="sound" /> <!-- needed in ie case -->

<div id="logo-div">
<a href="/"><img src="/img/logo.png" id="website-logo" alt="Word Hard And Fun logo"></a>
</div>


dimanche 31 mars 2013

Module de contact pour Prestashop

Je viens juste de déveopper  un module de contact customizé pour prestashop, le code n'est pas encore trop clean mais fonctionnel, le travail a été fait surla base du module sendtofriend.
La version actuelle est en français, les paramètres de langues ne sont pas respectés, mais le module est fonctionnel à 100% en français.
Ci-joint un screenshot du module

Je partage avec vous sur ce lien <télécharger depuis sourceforge>
Un exemple d'utilisation du module:
<a href="/modules/quickcontact/quickcontact-form.php?content_only=1&TB_iframe=true&width=500&height=300&thickbox=true" class="thickbox">NOUS CONTACTER </a>

vendredi 8 février 2013

Ajouter un symbol sur une google map

Là je met un petit code qui permet d'ajouter une map google
avec une ptite icone, c'est pas gde choZ mais ça peut être util

C'est simple:
1- laisser un div pour la map google dans notre exemple nous l'appellerons map_canvas
2- Creer un fichier javascript
contenant:


        var mapOptions = {
          zoom: 6,
          center: new google.maps.LatLng(longitude,latitude),
          mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        var map = new google.maps.Map(document.getElementById('map_canvas'),
                                      mapOptions);

(dans ce cas , et puis changez les longitudes et latitudes comme vous voulez)

3- Déclarer un objet image (notre icone)
var imagePgt = 'images/peugeot.png';

4-Ajouter l'icone à la map et dans l'emplacement specifique:

var marker = new google.maps.Marker({
            position: new google.maps.LatLng(longitude, latitude),
            map: map,
            icon: imagePgt
        });

c'est presque fini : voila un exemple entier:

 function initMap() {
        var mapOptions = {
          zoom: 6,
          center: new google.maps.LatLng(33.861293,10.085449),
          mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        var map = new google.maps.Map(document.getElementById('map_canvas'),
                                      mapOptions);

        var imagePgt = 'images/peugeot.png';
        
    var pgtMarker1 = new google.maps.Marker({
            position: new google.maps.LatLng(36.733063, 10.320570),
            map: map,
            icon: imagePgt
        });
}
5- appel à la méthode initMap() apres le chargement du doc en cas d'utilisation de jquery, ou bien appel direct à la fonction apres la declaration du div dans le html
 ( <script> initMap(); </script>)

vendredi 1 février 2013

Internet explorer and column count css property

this week we faced the non support of column-count property problem by the microsoft ie,
finally we ve found a an efficient solution based on a jquery plugin "columnizer plugin "


this is a typical css code for columnized div


.my-column
{
-moz-column-count:3; /* Firefox */
-webkit-column-count:3; /* Safari and Chrome */
 column-count:3;
}
as we said this style is not interpreted by ie  
then


1- we can download the plugin  columnizer

2- we import the appropiriate js file
<script src="????/js/jquery.columnizer.js" type="text/javascript"></script>

3- Now we add a short code to let only Internet explorer invoke the plugin

<script>
$(function(){
if($.browser.msie){
$('.my-column').columnize({
columns:3
});
}
});
</script>
(JQuery is needed in all cases)

That's all thanks to Adam Wulf  the author of the plugin

mercredi 16 janvier 2013

Country of manufacture Magento

Bonsoir,
Voilà un bout de code pour deviner le pays d'origine d'un produit:
 Ne vous inquiètez pas si un var_dump($_product) ne retourne aucun attribut dy type country_of_manufacture , faut mettre le bout de code suivant:
  $productCollection = Mage::getResourceModel('catalog/product_collection')
      ->addFieldToFilter('entity_id', $_product->getId())
      ->addAttributeToSelect('country_of_manufacture');
  foreach ($productCollection as $p) {
$manufacture = $p->getCountryOfManufacture();
  }
Voilà tout