Une bannière contre la censure

13 février 2010,
par Romy Têtue

Mots-clefs associés à cet article :

Bannière de soutien à Siu Lan Ko, censurée par les Beaux-Arts de Paris.

Pour avoir osé jouer sur les mots d’un slogan sarkoziste, l’œuvre de l’artiste chinoise Siu Lan Ko a été censurée cette semaine par les Beaux-Arts de Paris. Malgré ses réclamations, son œuvre n’a pas été réinstallée pour le vernissage de l’exposition, où plusieurs personnes ont manifesté leur soutien hier soir en dispersant des centaines de petits papiers marqués des quatre mots incriminés, « travailler », « plus », « gagner » et « moins », en réclamant la démission du directeur de l’école.
Faisons de même sur le Web !

Je me suis inspirée de l’œuvre censurée de Siu Lan pour confectionner une bannière web semblable : verticale et animée avec jQuery pour afficher aléatoirement les quatre mots incriminés. Voici le code à copier-coller dans le corps de votre page HTML, en l’adaptant si besoin pour votre site :

<!-- Banniere de soutien a l'oeuvre de Siu Lan Ko censuree par les Beaux-Arts de Paris le 10/02/2010 -->
<!-- Cf.: http://romy.tetue.net/travailler-gagner-plus-moins -->
<div id="siulanko">
        <a href="http://romy.tetue.net/travailler-gagner-plus-moins">Soutien &agrave; Siu&nbsp;Lan&nbsp;Ko,<br />contre la censure&nbsp;!</a>
        <ul>
                <li><img src="http://romy.tetue.net/IMG/gif/siulanko-travailler.gif" alt="travailler" width="100" height="600" /></li>
                <li><img src="http://romy.tetue.net/IMG/gif/siulanko-plus.gif" alt="plus" width="100" height="600" /></li>
                <li><img src="http://romy.tetue.net/IMG/gif/siulanko-gagner.gif" alt="gagner" width="100" height="600" /></li>
                <li><img src="http://romy.tetue.net/IMG/gif/siulanko-moins.gif" alt="moins" width="100" height="600" /></li>
        </ul>
</div>
<style type="text/css">
#page { margin-left: 100px; }
#siulanko { z-index: 100; position: absolute; position: fixed; top: 0; left: 0; width: 100px; height: 100%; background: #000; color: #fff; text-align: center; overflow: hidden; }
#siulanko a { display: block; padding: .3em .2em 0; color: #666; text-decoration: none; line-height: 1em; font-size: 10px; }
#siulanko a:active, #siulanko a:hover, #siulanko a:focus { color: #eee; border: 0; }
</style>
<script type="text/javascript" src="http://medienfreunde.com/lab/innerfade/js/jquery.innerfade.js"></script>
<script type="text/javascript">$('#siulanko ul').innerfade({ speed: 'slow', timeout: 4000, type: 'random', containerheight: '600px' });</script>

Et voici le résultat, en page d’accueil de mon site :

{#TITRE,#URL_ARTICLE,#INTRODUCTION}

Vos commentaires

Répondre à cet article

forum message

Raccourcis : {{gras}} {italique} -liste [bla->url] <q> <quote> <code>.

Qui êtes-vous ? (optionnel)

Suivre les commentaires : RSS 2.0 | Atom