Deux modes de vue Blog

Tags:: blog :: javascript :: mootools :: html

Après tant de remarques sur ma "vue en colonne de mon blog", j'ai décidé de laisser les internautes décider de voir la page en colonne ou non. Regardez donc le menu en haut à droite, un nouveau bouton vous permet de passer d'un mode à l'autre.

La méthode est simple, un javascript Mootools fait passer les tickets d'un div à l'autre selon l'état enregistré. Voici la partie la plus intéressante:


var Site = {
//...
   var b = new Element('li')
        var a = new Element('a').setText('Vue en colonne').setProperty('href',"#")
        a.addEvent('click', function (){
            if (!Site.columns){
                Site.orders = []
                $$('.blog-ticket').each(function (el,i){
                    Site.orders.push(el);
                    if(i%2!=0) el.injectInside('content-right')
                    else el.injectInside('content-left')
                })
                Site.orders.push($$('.blog_pager')[0])
                this.setText('Vue traditionnelle')

            } else {
           
                Site.orders.each(function (el,i){
                    el.injectInside('blog_mainview');
                });
                this.setText('Vue en colonne')
            }
            Site.columns = !Site.columns
        });
        a.injectInside(b)
        b.injectInside('nav')
//...
}
 

En d'autres termes, un utilisateur n'ayant pas Javascript restera sur la vue traditionnelle, sinon je propose un nouveau bouton qui balade les tickets dans la page.

Bref, à vous de juger, mais je vais déjà rester dans ces couleurs... Reste l'intégration des AddSenses à repenser.

Utilisez le code barre pour ouvrir le ticket dans votre mobile:
This ticket on you mobile

Pas de commentaire pour le moment

Ajouter un commentaire
Veuillez répondre à la question suivante : Pim pam et tapez "poom" sans les guillemets

Trackbacks

Pour ajouter un trackback (retrolien) sur ce ticket, utilisez cette adresse: http://www.metal3d.org/index.php/trackback/default/tb?id=blog%2F238

Tags

Blog Copix Communication PC Config Fedora Vidéo Humour Autre Web Materiel Informatique PHP Développement Mootools HTML Linux WEB IE CSS Vista Microsoft Sympa XHTML Quizz Widget Klik CWE Voeux Bonne année Musique CCRMA Son Audio MAO Reconnaissance vocale Windows Mac Compiz MacOS Mysql Sun Base de données BD Screenlets Screenlet RPM compiz Ubuntu Live FireFox Derambarsh Facebook media informations Sécurité javascript SSH Commande Marketing concours ipod wii QT Trooltech Nokia Libre Logiciels GPL Attali Gnome Dock Compiler Bench undelete reiserfs recovery recover Thread Serveur Optimisation Server Apache Album RSS Flash Air XML Firefox Blender Opensource Orange Internet LiveBox Animaux Droits Logiciels Libres Google Loi RBS netcat Bash Téléphone Spam 3D NIDIA Standards Widgets Merise UML Streaming Developpement Perl MySQL Firewall Parfeu Bayes Novell Réseau Python LVS Salon FTP Dedibox Chrome Administration IRC Gentoo troll video Nouveauté Finance Etudiant spéctacle OpenOffice Javascript Java Info Eclpise ATI design mootools KDE Bureau Design GNU C Pages Jaunes Fun Bijoux Art mail Admin vmware fedora linux VirtualBox VMWare Qemu KVM vim Grep Fglrx Webkit GTK google web JQuery Coup de gueule coup de gueule Lois SVG Raycaster Canvas Hadopi Desktop Jeux Les Sims développement astuces Screen firefox Mobile Safaru Wine bash commande astuce Wave ooc C++ C# Netbook Hercules Bureautique Twitter Safari W3C chrome kazehakaze midori navigateur gecko webkit Links Liens Pyhon Nouvelles Metal Perso Conférence JDLL PCC Roadsend OOC News Acteur Cinéma Chanteur Seven windows orthographe pcc php jdll Slide Application mysql Html twitter python screen curses SVN Android Gphone iPhone OpenGL MindMap Projet Javascrtip Ajax Guitare Tab Tablature JSON firebug Chromium Iphone Titanium music sound android ogg ogv streaming Arkyne svn subversion gnome VLC Tv encoder ffmpeg Cryptage apple microsoft HTML5 Max Apple code youtube quvi git uzbl webgl chromium

  Catalogue professionnel de musique libre


  • twitter entries...
follow me on Twitter

Valid XHTML 1.0 Strict

tumblr visitor