Strict Standards: Declaration of action_plugin_dlcount::register() should be compatible with DokuWiki_Action_Plugin::register($controller) in /home/www/wiki/lib/plugins/dlcount/action.php on line 14

Strict Standards: Declaration of action_plugin_indexmenu::register() should be compatible with DokuWiki_Action_Plugin::register($controller) in /home/www/wiki/lib/plugins/indexmenu/action.php on line 169

Strict Standards: Declaration of action_plugin_ipban::register() should be compatible with DokuWiki_Action_Plugin::register($controller) in /home/www/wiki/lib/plugins/ipban/action.php on line 67

Strict Standards: Declaration of action_plugin_loglog::register() should be compatible with DokuWiki_Action_Plugin::register($controller) in /home/www/wiki/lib/plugins/loglog/action.php on line 82

Strict Standards: Declaration of action_plugin_navi::register() should be compatible with DokuWiki_Action_Plugin::register($controller) in /home/www/wiki/lib/plugins/navi/action.php on line 46

Strict Standards: Declaration of action_plugin_uparrow::register() should be compatible with DokuWiki_Action_Plugin::register($controller) in /home/www/wiki/lib/plugins/uparrow/action.php on line 69

Strict Standards: Declaration of action_plugin_userspagecreate::register() should be compatible with DokuWiki_Action_Plugin::register($controller) in /home/www/wiki/lib/plugins/userspagecreate/action.php on line 97

Strict Standards: Declaration of cache_instructions::retrieveCache() should be compatible with cache::retrieveCache($clean = true) in /home/www/wiki/inc/cache.php on line 289

Warning: Cannot modify header information - headers already sent by (output started at /home/www/wiki/lib/plugins/dlcount/action.php:14) in /home/www/wiki/inc/auth.php on line 312

Strict Standards: Only variables should be passed by reference in /home/www/wiki/doku.php on line 71

Warning: Cannot modify header information - headers already sent by (output started at /home/www/wiki/lib/plugins/dlcount/action.php:14) in /home/www/wiki/inc/actions.php on line 154
Container center [phpwcms-HowTo:wiki]

Strict Standards: Declaration of syntax_plugin_code::render() should be compatible with DokuWiki_Syntax_Plugin::render($format, &$renderer, $data) in /home/www/wiki/lib/plugins/code/syntax.php on line 41

Strict Standards: Declaration of syntax_plugin_tip::render() should be compatible with DokuWiki_Syntax_Plugin::render($format, &$renderer, $data) in /home/www/wiki/lib/plugins/tip/syntax.php on line 38

Container center

Simply vertical/horizontal center of the browser window

From sternpunkt blog

From time to time it needs a fast solution for a problem or a desire. This centring is so a solution.

The horizontal centring of a side in the Browserfenster is still quite simply feasible over CSS, the vertical centring against it is connected with much more effort. Therefore this variant by JS.


jquery.centercontainer.js V1.0 10.12.09

Docu: –
Forum: –

Autor: blog.sternpunkt.at
wiki-Autor: K.Heermann (flip-flop) http://planmatrix.de)
CMS Version: >= 1.4.4 (r381)
Version: V1.0

Tag: –

Fileiname: jquery.centercontainer.js

Folder: template/lib/jquery/plugin/

Condition:/config/phpwcms/conf.inc.php

  • $phpwcms['allow_cntPHP_rt'] = 1;
  • JS switch to on in browser


Description:

The JS-code is stored in the listing indicated above and the appropriate ID/class from the template (e.g. container01) entered in the script (See script).

  • In the relevant template is selected by JS library: jQuery.
  • A container is placed around the site (e.g. container01)
  • In the template at any point the JS-Plugin is initialized
    [PHP]initJSPlugin('centercontainer');[/PHP]


Layout:


Template:


Code

Please insert into the file template/lib/jquery/plugin/jquery.centercontainer.js the following snippet.

Change your ID/class around line 19 and 27.

jquery.centercontainer.js

/*************************************************************
* 10.12.09
* Autor: http://blog.sternpunkt.at/2009/06/25/vertikal_zentrieren_ganz_einfach/#
*
* JQuery script for vertical and horizontal centering
* in browser window
*
* Change the selector:
* ---------------------
* Change your ID/class around line 19 and 27
*
**************************************************************/
 
 
//-----------------------------------------------
// Durng page loading center container
//-----------------------------------------------
$(document).ready(function(){
    setCenter('#container01');  //Your ID or class of the container
});
 
//-----------------------------------------------
// When resizing the window re-center containers
//
//-----------------------------------------------
$(window).bind('resize', function(event) {
    setCenter('#container01');  //Your ID or class of the container
});
 
//-----------------------------------------------
// Container center vertically
//-----------------------------------------------
function VerticalCenter(elem) {
    var top=($(window).height() - $(elem).height()) / 2;
    $(elem).css('margin-top',top);
}
 
//-----------------------------------------------
// Container center horizontally
// (Alternatively, with CSS -> margin: auto;)
//-----------------------------------------------
function HorizontalCenter(elem) {
    var left=($(window).width() - $(elem).width()) / 2;
    $(elem).css('margin-left',left);
}
 
//------------------------------------------------
// Both center
//------------------------------------------------
function setCenter(elem) {
    VerticalCenter(elem);
    HorizontalCenter(elem);
}
english/other-enhancements/jquery/container-center.txt · Last modified: 2009/12/12 12:12 by Knut Heermann (flip-flop)
www.planmatrix.de www.chimeric.de Creative Commons License Valid CSS Driven by DokuWiki do yourself a favour and use a real browser - get firefox!! Recent changes RSS feed Valid XHTML 1.0

Strict Standards: Only variables should be passed by reference in /home/www/wiki/doku.php on line 79