Changeset 7990 for plugins_spip


Ignore:
Timestamp:
12/20/13 14:05:25 (6 years ago)
Author:
kent1
Message:

Ajouter les flèches de navigation

Location:
plugins_spip/terraeco_infographie/trunk
Files:
2 added
2 edited

Legend:

Unmodified
Added
Removed
  • plugins_spip/terraeco_infographie/trunk/css/infographie.css

    r7985 r7990  
    388388        background:transparent url(img/bouton_fermer.png) no-repeat 0 0;
    389389}
     390
     391.arrows_nav{
     392        text-align:center;
     393}
     394.arrows_nav > div{
     395        width:40px;
     396        background-color:#F29100;
     397        display:inline-block;
     398        padding: 5px 10px 5px 5px;
     399        cursor:pointer;
     400}
     401
     402.arrows_nav > div:nth-child(1){
     403        margin-right:10px;
     404}
     405.arrows_nav > div:hover{
     406        background-color:#D74B0B;
     407}
     408.co2 .arrows_nav > div{
     409        background-color:#327f75;
     410}
  • plugins_spip/terraeco_infographie/trunk/infographie.html

    r7989 r7990  
    105105
    106106                                                $('#'+containerid).on('mousewheel', function(event) {
    107                                                         console.log('wheel');
    108107                                                        if($('.infobox').is(':hidden') && moving == false){
    109108                                                                if(event.deltaX > 0)
     
    115114                                                                else if(event.deltaY < 0)
    116115                                                                        var val = -1;
    117                                                                 moving = true;
    118116                                                                graph_replace(val);
    119117                                                        }else if($('.infobox').is(':visible')){
     
    128126                                                                return false;
    129127                                                       
     128                                                        moving = true;
     129                                                       
    130130                                                        date_origine = date_origine+valeur;
    131131
     132                                                        /**
     133                                                         * A essayer : values.filter
     134                                                         * cf : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
     135                                                         */
    132136                                                        values.every(function(row, i){
    133137                                                                if(parseInt(row.axe_x) == date_origine){
     
    204208                                                infobox = d3.select('#'+containerid).append("div")
    205209                                                        .attr("class", "infobox")
    206                                                         .style("display", 'none').html('<div class="logo"><div class="contenu"></div>');
     210                                                        .style("display", 'none').html('<div class="logo"></div><div class="contenu"></div>');
    207211                                               
    208212                                                // Au click sur le graph, on cache l'infobox si visible
     
    211215                                                                $('.infobox').fadeOut();
    212216                                                });
     217                                               
     218                                                // Ajouter les flÚches pour avancer et reculer
     219                                                arrow_nav = d3.select('#'+containerid).append("div")
     220                                                        .attr("class", "arrows_nav")
     221                                                        .html('<div class="left">[(#CHEMIN{images/fleche_gauche.png}|balise_img|texte_script)]</div><div class="right">[(#CHEMIN{images/fleche_droite.png}|balise_img|texte_script)]</div>');
     222                                               
     223                                                // Au click sur les fleches on avance d'un cran ou on recule
     224                                                $('.arrows_nav > div').on('click',function(){
     225                                                        if(moving == false){
     226                                                                if($(this).is('.left'))
     227                                                                        graph_replace(-1);
     228                                                                else
     229                                                                        graph_replace(1);
     230                                                        }
     231                                                });
     232                                               
    213233                                                // Add the clip path.
    214234                                                svg.append("clipPath")
Note: See TracChangeset for help on using the changeset viewer.