Sådan benyttes komponenten CssMenuFisheye klassen
Først skal du inkludere den fil der beskriver komponenten, som en klasse fil
<? require_once(HTML_PACKAGE_PATH.'/CssMenuFisheye.php'); ?>
Dernæst kan du enten benytte komponenten som et taglib (statiske metoder):
<? CssMenuFisheye::display($param1, $param2, $param3, ...); ?>
eller du kan lave en instance af komponenten og benytte metoderne direkte:
<? $object = new CssMenuFisheye($param1, $param2, $param3, ...); print $object->getHtml(); ?>
Sådan vises komponenten CssMenuFisheye klassen
Den fulde PHP kildekode for CssMenuFisheye klassen
<?php/** * @package menu-fisheye * @see HTML_MENU_FISHEYE_PAGE_PATH.'/CssMenuFisheye.php' * @copyright (c) http://Finn-Rasmussen.com * @license http://Finn-Rasmussen.com/license/ myPHP License conditions * @author http://Finn-Rasmussen.com * @version 1.11 * @since 27-nov-2009 *//** * The required files */require_once(HTML_BASE_PAGE_PATH.'/Css.php');/** * Generates the Menu CSS * <code> * Usage: * $href = "menufisheye.css"; * $css = new CssMenuFisheye($href); * print $css->getHtml(); * Or: * CssMenuFisheye::display($href); * </code> * @package menu-fisheye */class CssMenuFisheye extends Css { /** * Constructor * @param String $href The url to the css filename (i.e. menufisheye.css) */ function __construct($href='') { parent::__construct($href != '' ? $href : CSS_FILE_NAME_MENU_FISHEYE); } /** * Get an array of css key/value pairs * @return array The array of CSS key vakue pairs */ function getFisheyeContainter() { return array( CSS_NAME_STYLE_PROPERTY=>'.'.CSS_FISHEYE_CONTAINTER, CSS_NAME_BACKGROUND_COLOR=>CSS_CANVAS_BACKGROUND, CSS_NAME_WIDTH=>'200px', CSS_NAME_HEIGHT=>'50px', CSS_NAME_LEFT=>'500px', CSS_NAME_POSITION=>CSS_POSITION_ABSOLUTE, ); } /** * Get an array of css key/value pairs * @return array The array of CSS key vakue pairs */ function getFisheye() { return array( CSS_NAME_STYLE_PROPERTY=>'.'.CSS_FISHEYE, CSS_NAME_TEXT_ALIGN=>CSS_TEXT_ALIGN_CENTER, CSS_NAME_HEIGHT=>'50px', CSS_NAME_POSITION=>CSS_POSITION_RELATIVE, ); } /** * Get an array of css key/value pairs * @return array The array of CSS key vakue pairs */ function getFisheyeItem() { return array( CSS_NAME_STYLE_PROPERTY=>'a.'.CSS_FISHEYE_ITEM, CSS_NAME_TEXT_ALIGN=>CSS_TEXT_ALIGN_CENTER, CSS_NAME_COLOR=>CSS_BODY_COLOR, CSS_NAME_BACKGROUND_COLOR=>CSS_CANVAS_BACKGROUND, CSS_NAME_FONT_WEIGHT=>CSS_FONT_WEIGHT_BOLD, CSS_NAME_TEXT_DECORATION=>CSS_TEXT_DECORATION_NONE, CSS_NAME_WIDTH=>'40px', CSS_NAME_POSITION=>CSS_POSITION_ABSOLUTE, CSS_NAME_DISPLAY=>CSS_DISPLAY_BLOCK, CSS_NAME_TOP=>'0', CSS_NAME_BACKGROUND=>CSS_BACKGROUND_TRANSPARENT, ); } /** * Get an array of css key/value pairs * @return array The array of CSS key vakue pairs */ function getFisheyeItemImg() { return array( CSS_NAME_STYLE_PROPERTY=>'.'.CSS_FISHEYE_ITEM.' img', CSS_NAME_BACKGROUND_COLOR=>CSS_CANVAS_BACKGROUND, CSS_NAME_BORDER=>CSS_BORDER_NONE, CSS_NAME_MARGIN=>'0 auto 5px auto', CSS_NAME_WIDTH=>'100%', CSS_NAME_BACKGROUND=>CSS_BACKGROUND_TRANSPARENT, ); } /** * Get an array of css key/value pairs * @return array The array of CSS key vakue pairs */ function getFisheyeItemSpan() { return array( CSS_NAME_STYLE_PROPERTY=>'.'.CSS_FISHEYE_ITEM.' span', CSS_NAME_BACKGROUND_COLOR=>CSS_CANVAS_BACKGROUND, CSS_NAME_DISPLAY=>CSS_DISPLAY_NONE, CSS_NAME_POSITION=>CSS_POSITION_ABSOLUTE, ); } /** * Returns the css Menu Fisheye components * @return String the complete css */ function getCustom() { $html = ''; $html .= $this->getHeader($this->getClassName()); $html .= $this->getComponent('.'.CSS_MENU_FISHEYE,CSS_MENU_FISHEYE_COLOR,CSS_MENU_FISHEYE_BACKGROUND,'','',CSS_TEXT_DECORATION_NONE); $html .= $this->getCssArray($this->getFisheye()); $html .= $this->getCssArray($this->getFisheyeItem()); $html .= $this->getCssArray($this->getFisheyeItemImg()); $html .= $this->getCssArray($this->getFisheyeItemSpan()); $html .= $this->getCssArray($this->getFisheyeContainter()); return $html; } /** * Display html * <code> * Usage: * $href = "menufisheye.css"; * CssMenuFisheye::display($href); * </code> * @static * @param String $href, The url to the css file (i.e. menufisheye.css) */ public static function display($href='') { $html = new CssMenuFisheye($href); $html->addHtml(); }}?>
Den fulde HTML kildekode for CssMenuFisheye klassen
<? <!-- DEBUG: CssMenuFisheye --> <style type="text/css"> /*********************************************************** * * AUTOGENERATED file, DO NOT CHANGE OR EDIT, the full source code is here _____________________________________________________ ________| |________ \ | http://Finn-Rasmussen.com Phone (+45) 40 50 60 69 | / \ | Kongens Vænge 79, 3400 Hillerød, Denmark | / / |_____________________________________________________| \ /___________) (__________\ * * @version : 1.11 * @since : 19-May-2012 20:00:29 * @copyright : Copyright © 1999-2010 http://Finn-Rasmussen.com * * Email : Please, phone me for my email address * Web : http://Finn-Rasmussen.com * : This website was created by the myPHP taglib and CMS * : Download a free demo of the myPHP taglib here ... * : http://Finn-Rasmussen.com/myPHP/ * @domain : myrer.info * @language : da * @webmaster : DEFAULT_CMS_LOGIN_USERNAME(+)myrer.info * @file : /cache/files/myrer.info-menufisheye.css (Autocreated cache file) * @classname : CssMenuFisheye ***********************************************************/ .menuFisheye{ color : #000; background-color : #ddd; } a:link.menuFisheye,a:visited.menuFisheye,a:active.menuFisheye{ color : #000; background-color : #ddd; font-size : 11px; font-weight : bold; text-decoration : none; } a:hover.menuFisheye{ color : #ddd; background-color : #000; font-size : 11px; font-weight : bold; text-decoration : none; } img.menuFisheye{ color : #ddddde; background-color : #ddd; border-style : none; } .fisheye{ text-align : center; height : 50px; position : relative; } a.fisheyeItem{ text-align : center; color : #000; background-color : #ddd; font-weight : bold; text-decoration : none; width : 40px; position : absolute; display : block; top : 0; background : transparent; } .fisheyeItem img{ background-color : #ddd; border : none; margin : 0 auto 5px auto; width : 100%; background : transparent; } .fisheyeItem span{ background-color : #ddd; display : none; position : absolute; } .fisheyeContainter{ background-color : #ddd; width : 200px; height : 50px; left : 500px; position : absolute; } /* DEBUG, Not cached, CSS Custom file : /cache/css/myrer.info-menufisheye.css */ </style> ?>
Her er 'klasse metoderne' for CssMenuFisheye klassen:
Her er 'objekt variable' for CssMenuFisheye klassen: