Nol c'est fini...
Ajout d'un script javascript pour faire du scrollage asynchrone avec la barre de droite du wiki darcs-hash:20070106220113-f46e9-3ccd3a5298fe9741dc0b58f422f2e6d81a2baed7.gz
This commit is contained in:
parent
e638a678b3
commit
8daf0a25c7
3 changed files with 382 additions and 18 deletions
|
@ -67,9 +67,8 @@ div#titleBarre {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
width:100%;
|
width:100%;
|
||||||
border-bottom: thin solid #f9821d;//orange;
|
border-bottom: thin solid #f9821d;//orange;
|
||||||
/* modif de noel */
|
|
||||||
background: url("../img/BarreOrangeNeige.png") repeat-x;
|
background: url("../img/BarreOrange.png") repeat-x;
|
||||||
/*background: url("../img/BarreOrange.png") repeat-x;*/
|
|
||||||
text-align:left;
|
text-align:left;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
@ -91,9 +90,7 @@ h1#title
|
||||||
width:100%;
|
width:100%;
|
||||||
height:25px;
|
height:25px;
|
||||||
padding:5px 10px 10px 10px;
|
padding:5px 10px 10px 10px;
|
||||||
/* # modif de noel */
|
background: url("../img/BarreLogo.png") no-repeat right top;
|
||||||
background: url("../img/BarreLogoNeige.png") no-repeat right top;
|
|
||||||
/*background: url("../img/BarreLogo.png") no-repeat right top;*/
|
|
||||||
}
|
}
|
||||||
|
|
||||||
h1#title a {
|
h1#title a {
|
||||||
|
@ -103,17 +100,6 @@ h1#title a {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* MODIF DE NOEL */
|
|
||||||
div#specialNoel {
|
|
||||||
position:fixed;
|
|
||||||
left:0;
|
|
||||||
bottom:0;
|
|
||||||
width:80px;
|
|
||||||
height:80px;
|
|
||||||
background:transparent url("/wiki/crans/img/noel.png") left bottom;
|
|
||||||
}
|
|
||||||
div#specialNoel:hover {width:258px;height:261px;}
|
|
||||||
|
|
||||||
|
|
||||||
/*<!-- MENU DE DROITE -->*/
|
/*<!-- MENU DE DROITE -->*/
|
||||||
|
|
||||||
|
@ -132,7 +118,7 @@ div#column-one {
|
||||||
/* dimensions */
|
/* dimensions */
|
||||||
padding:5px 10px 10px 10px;
|
padding:5px 10px 10px 10px;
|
||||||
width:150px;
|
width:150px;
|
||||||
height:100%;
|
//height:100%;
|
||||||
overflow:hidden;
|
overflow:hidden;
|
||||||
margin:0px;
|
margin:0px;
|
||||||
/* texte */
|
/* texte */
|
||||||
|
|
309
wiki/static/crans/css/crans.noel.css
Normal file
309
wiki/static/crans/css/crans.noel.css
Normal file
|
@ -0,0 +1,309 @@
|
||||||
|
/*************************************************************
|
||||||
|
..
|
||||||
|
.... ............ ........
|
||||||
|
. ....... . .... ..
|
||||||
|
. ... .. .. .. .. ..... . ..
|
||||||
|
.. .. ....@@@. .. . ........ .
|
||||||
|
.. . .. ..@.@@..@@. .@@@@@@@ @@@@@@. ....
|
||||||
|
.@@@@. .@@@@. .@@@@..@@.@@..@@@..@@@..@@@@.... ....
|
||||||
|
@@@@... .@@@.. @@ @@ .@..@@..@@...@@@. .@@@@@. ..
|
||||||
|
.@@@.. . @@@. @@.@@..@@.@@..@@@ @@ .@@@@@@.. .....
|
||||||
|
...@@@.... @@@ .@@.......... ........ ..... ..
|
||||||
|
. ..@@@@.. . .@@@@. .. ....... . .............
|
||||||
|
. .. .... .. .. . ... ....
|
||||||
|
. . .... ............. .. ...
|
||||||
|
.. .. ... ........ ... ...
|
||||||
|
................................
|
||||||
|
|
||||||
|
==============================================================
|
||||||
|
crans.css - MoinMoin Style
|
||||||
|
|
||||||
|
Theme crans (screen)
|
||||||
|
|
||||||
|
|
||||||
|
Copyright (c) 2006 by www.crans.org
|
||||||
|
|
||||||
|
**************************************************************/
|
||||||
|
/* IMPORTS
|
||||||
|
/!\ les imports doivent imperativement se faire avant
|
||||||
|
toute autre regle css !!!
|
||||||
|
*/
|
||||||
|
/* imports déjà faits dans common.css
|
||||||
|
/*@import url('/wiki/common/toc/toc.css');
|
||||||
|
@import url('/wiki/common/boxes/boxes.css');
|
||||||
|
@import url('/wiki/common/EventCalendar/EventCalendar.css');
|
||||||
|
*/
|
||||||
|
/*<!-- BODY -->*/
|
||||||
|
body, html{
|
||||||
|
padding:0;
|
||||||
|
margin:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
div#content
|
||||||
|
{
|
||||||
|
background:white;
|
||||||
|
position:relative;
|
||||||
|
margin:40px 170px 0 0;
|
||||||
|
padding:0 15px 0 4.5em;
|
||||||
|
background-image: url("../img/fond.png");
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center center;
|
||||||
|
background-attachment: fixed;
|
||||||
|
min-height:500px;
|
||||||
|
overflow:auto;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/*<!-- TITRE -->*/
|
||||||
|
div#titleBarre {
|
||||||
|
float:right;
|
||||||
|
z-index:5;
|
||||||
|
position: fixed; /* positionnement */
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
padding:0;
|
||||||
|
margin:0;
|
||||||
|
height: 40px;
|
||||||
|
width:100%;
|
||||||
|
border-bottom: thin solid #f9821d;//orange;
|
||||||
|
/* modif de noel */
|
||||||
|
background: url("../img/BarreOrangeNeige.png") repeat-x;
|
||||||
|
/*background: url("../img/BarreOrange.png") repeat-x;*/
|
||||||
|
text-align:left;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
div#titleBarre * {
|
||||||
|
color:white;
|
||||||
|
font: 25px "Trebuchet MS", helvetica, sans-serif ;
|
||||||
|
text-decoration:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1#title
|
||||||
|
{
|
||||||
|
/* pour ie */
|
||||||
|
position:absolute;
|
||||||
|
top:0;
|
||||||
|
/* fin pour ie */
|
||||||
|
margin: 0;
|
||||||
|
display:block;
|
||||||
|
width:100%;
|
||||||
|
height:25px;
|
||||||
|
padding:5px 10px 10px 10px;
|
||||||
|
/* # modif de noel */
|
||||||
|
background: url("../img/BarreLogoNeige.png") no-repeat right top;
|
||||||
|
/*background: url("../img/BarreLogo.png") no-repeat right top;*/
|
||||||
|
}
|
||||||
|
|
||||||
|
h1#title a {
|
||||||
|
color:white;
|
||||||
|
font: 25px "Trebuchet MS", helvetica, sans-serif ;
|
||||||
|
text-decoration:none;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/* MODIF DE NOEL */
|
||||||
|
div#specialNoel {
|
||||||
|
position:fixed;
|
||||||
|
left:0;
|
||||||
|
bottom:0;
|
||||||
|
width:80px;
|
||||||
|
height:80px;
|
||||||
|
background:transparent url("/wiki/crans/img/noel.png") left bottom;
|
||||||
|
}
|
||||||
|
div#specialNoel:hover {width:258px;height:261px;}
|
||||||
|
|
||||||
|
|
||||||
|
/*<!-- MENU DE DROITE -->*/
|
||||||
|
|
||||||
|
div#column-one ul, div#column-one li { /* utilisation de liste pour le menu */
|
||||||
|
list-style-type: none; /* suppression des puces de liste */
|
||||||
|
margin:0;
|
||||||
|
padding:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
div#column-one {
|
||||||
|
/* position */
|
||||||
|
z-index:2;
|
||||||
|
position: fixed;
|
||||||
|
right:0;
|
||||||
|
top:41px;
|
||||||
|
/* dimensions */
|
||||||
|
padding:5px 10px 10px 10px;
|
||||||
|
width:150px;
|
||||||
|
//height:100%;
|
||||||
|
overflow:hidden;
|
||||||
|
margin:0px;
|
||||||
|
/* texte */
|
||||||
|
font: 0.9em "Trebuchet MS", helvetica, sans-serif;
|
||||||
|
text-align:left;
|
||||||
|
/* couleurs */
|
||||||
|
background:#eeeeee;
|
||||||
|
border-left:thin solid #bbbbbb;
|
||||||
|
border-bottom:thin solid #bbbbbb;
|
||||||
|
border-top: thin solid #cccccc;//gris clair;
|
||||||
|
}
|
||||||
|
|
||||||
|
div#column-one li a {
|
||||||
|
margin:2px;
|
||||||
|
text-decoration:none;
|
||||||
|
color:#888888;
|
||||||
|
}
|
||||||
|
|
||||||
|
div#column-one li a:hover {
|
||||||
|
text-decoration:underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
div#p-logo {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* titres */
|
||||||
|
div#column-one h5 {
|
||||||
|
margin:2px;
|
||||||
|
text-decoration:none;
|
||||||
|
font-size:1em;
|
||||||
|
font-weight:bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.portlet:after {
|
||||||
|
content:url(../img/Separator.png);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* champ de recherche */
|
||||||
|
#searchInput {
|
||||||
|
padding: 2px 2px 2px 18px;
|
||||||
|
background: #fff url(../img/q.png) no-repeat 4px center;
|
||||||
|
width:132px;
|
||||||
|
font: 0.9em "Trebuchet MS", helvetica, sans-serif;
|
||||||
|
border:thin gray solid;
|
||||||
|
margin: 5px 0;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
#timings
|
||||||
|
{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#credits, #version, #timings{
|
||||||
|
margin: 5px 10px;
|
||||||
|
padding: 0;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 0.88em;
|
||||||
|
color: #6C7680;
|
||||||
|
}
|
||||||
|
|
||||||
|
#credits li, #timings li {
|
||||||
|
display: inline;
|
||||||
|
padding: 0 2px;
|
||||||
|
margin: 0 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/*<!-- EDITEUR DE TEXTE -->*/
|
||||||
|
textarea {
|
||||||
|
width: 95%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.diff {
|
||||||
|
width:99%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.diff-header {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.diff-title {
|
||||||
|
background-color: #C0C0C0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.diff-added {
|
||||||
|
background-color: #E0FFE0;
|
||||||
|
vertical-align: sub;
|
||||||
|
}
|
||||||
|
|
||||||
|
.diff-removed {
|
||||||
|
background-color: #FFFFE0;
|
||||||
|
vertical-align: sub;
|
||||||
|
}
|
||||||
|
|
||||||
|
.diff-added span {
|
||||||
|
background-color: #80FF80;
|
||||||
|
}
|
||||||
|
|
||||||
|
.diff-removed span {
|
||||||
|
background-color: #FFFF80;
|
||||||
|
}
|
||||||
|
|
||||||
|
#message {
|
||||||
|
clear: both;
|
||||||
|
width: 100%;
|
||||||
|
margin: 40px 0 0 0;
|
||||||
|
padding: 5px 0px;
|
||||||
|
border-bottom: 1px solid #c9c9c9;
|
||||||
|
background: #E6EAF0;
|
||||||
|
font-size: 0.9em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#message p{
|
||||||
|
margin: 0;
|
||||||
|
padding: 0 10px 0 20px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
#message div.buttons {
|
||||||
|
font-weight: lighter;
|
||||||
|
padding: 0 0 0 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#preview {
|
||||||
|
border: 1px solid #6C7680;
|
||||||
|
padding: 10px 30px 20px 4.5em;
|
||||||
|
width:100%;
|
||||||
|
margin:10px 0 10px -3.5em;
|
||||||
|
background: url(../img/draft.png);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Collection de hacks à la con pour IE */
|
||||||
|
@media screen {
|
||||||
|
/* * html {
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
/**/
|
||||||
|
/* * html body {
|
||||||
|
overflow-y: auto;
|
||||||
|
height: 100%;
|
||||||
|
//padding: 44px 160px 0 1em;
|
||||||
|
font-size: 100%;
|
||||||
|
}
|
||||||
|
/**/
|
||||||
|
/* * html body {
|
||||||
|
overflow: hidden;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
* html body #page {
|
||||||
|
overflow: auto;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**/
|
||||||
|
* html div#column-one {
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
/**/
|
||||||
|
* html h1#title
|
||||||
|
{
|
||||||
|
position: absolute;
|
||||||
|
width: expression(document.body.clientWidth);
|
||||||
|
}
|
||||||
|
|
||||||
|
* html div.portlet
|
||||||
|
{
|
||||||
|
padding-bottom: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
/**/
|
69
wiki/static/crans/js/scroller.js
Normal file
69
wiki/static/crans/js/scroller.js
Normal file
|
@ -0,0 +1,69 @@
|
||||||
|
scroller =
|
||||||
|
{
|
||||||
|
}
|
||||||
|
;
|
||||||
|
|
||||||
|
scroller.element_id = "column-one";
|
||||||
|
scroller.min_top = 41;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
scroller.setMenuOffset = function()
|
||||||
|
{
|
||||||
|
|
||||||
|
|
||||||
|
var element = document.getElementById(scroller.element_id);
|
||||||
|
if (!element) return;
|
||||||
|
element.style.position = "fixed";
|
||||||
|
var currentWindowHeight = document.documentElement.clientHeight;
|
||||||
|
var currentScroll = document.documentElement.scrollTop || document.body.scrollTop; // body for Safari
|
||||||
|
var currentElementHeight = element.clientHeight;
|
||||||
|
|
||||||
|
var startPosition = scroller.min_top;
|
||||||
|
|
||||||
|
if (currentWindowHeight > currentElementHeight + startPosition)
|
||||||
|
{
|
||||||
|
|
||||||
|
element.style.top = startPosition + 'px';
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
var desiredPosition = startPosition - currentScroll ;
|
||||||
|
if (desiredPosition < currentWindowHeight - currentElementHeight)
|
||||||
|
desiredPosition = currentWindowHeight - currentElementHeight;
|
||||||
|
element.style.top = desiredPosition + 'px';
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
scroller.init = function ()
|
||||||
|
{
|
||||||
|
|
||||||
|
|
||||||
|
/* See if browser supports advanced interface */
|
||||||
|
|
||||||
|
//var advancedJavaScriptSupport = document.createElement && document.getElementsByTagName && createXMLHTTPObject();
|
||||||
|
//if (!advancedJavaScriptSupport) return;
|
||||||
|
|
||||||
|
/* Load advanced interface */
|
||||||
|
window.onscroll = document.documentElement.onscroll = scroller.setMenuOffset;
|
||||||
|
scroller.setMenuOffset();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// use this instead of assigning to window.onload directly:
|
||||||
|
function addLoadEvent(func) {
|
||||||
|
// alert("addLoadEvent " + func)
|
||||||
|
var oldonload = window.onload;
|
||||||
|
if (typeof window.onload != 'function') {
|
||||||
|
window.onload = func;
|
||||||
|
} else {
|
||||||
|
window.onload = function() {
|
||||||
|
oldonload();
|
||||||
|
func();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
addLoadEvent(scroller.init);
|
Loading…
Add table
Add a link
Reference in a new issue