You are here:
PANDA Wiki
>
System Web
>
JQueryPlugin
>
JQueryCorner
(12 Feb 2010,
ProjectContributor
)
(raw view)
E
dit
A
ttach
---+ %TOPIC% %JQPLUGINS{"corner" format=" Homepage: $homepage <br /> Author(s): $author <br /> Version: $version " }% %STARTSECTION{"summary"}% This plugin adds cross-browser support for rounded corners. For modern browsers the appropriate css attributes are used while there is a fallback strategy for others. %ENDSECTION{"summary"}% ---++ Usage ---+++ !JavaScript API The javascript API: =corner()= takes a single string argument: <verbatim class="js"> $('#myDiv').corner("effect corners width"); </verbatim> with * effect: name of the effect to apply, such as round, bevel, notch, bite, etc (default is round). * corners: one or more of: top, bottom, tr, tl, br, or bl.by default, all four corners are adorned. * width: width of the effect; in the case of rounded corners this is the radius. specify this value using the px suffix such as 10px Any element using the =jqCorner= class will be rounded. Options are extracted from the =data-corner= attribute of the markup. ---+++ Foswiki integration Add the ==jqCorner== class to elements that should be rounded. Additional parameter are provided via the =data-corner= attribute of an HTML element. (Note, that this differs from other plugins where parameters are provided inside the =class= attribute using JQueryMetadata.) ---++ Examples %JQREQUIRE{"corner"}% <literal> <style type="text/css"> .jqCorner { margin:1em 0.8em; padding:1em; float:left; width:250px; } .jqCorner h2.jqCorner { margin:-1em -0.7em 0.7em -0.7em; padding:0.8em; border:0px; float:none; width:auto; } </style> </literal> <div class="jqCorner" style="background:#bfdded;color:black"> <h2 class="jqCorner" data-corner="round top" style="color:#ffffff;background:#778cca"> 1. Lorem ipsum dolor sit amet </h2> Consectetuer adipiscing elit. Nulla dui turpis, convallis eget, lacinia id, vulputate ut, ipsum. Donec sed sem. Ut tempus. Nunc egestas consectetuer augue. Sed a nibh. Duis rutrum nibh. Sed in orci at arcu molestie ultrices. Quisque a lectus. In mollis, nulla id rutrum tincidunt, </div> <div class="jqCorner" style="background:#C4E786;color:black"> <h2 class="jqCorner" data-corner="round top" style="color:#ffffff;background:#9DC35B"> 2. Lorem ipsum dolor sit amet </h2> Consectetuer adipiscing elit. Nulla dui turpis, convallis eget, lacinia id, vulputate ut, ipsum. Donec sed sem. Ut tempus. Nunc egestas consectetuer augue. Sed a nibh. Duis rutrum nibh. Sed in orci at arcu molestie ultrices. Quisque a lectus. In mollis, nulla id rutrum tincidunt, </div> <div class="jqCorner" style="background:#ffd154;color:black"> <h2 class="jqCorner" data-corner="round top" style="color:#ffffff;background:#DBB13F"> 3. Lorem ipsum dolor sit amet </h2> Consectetuer adipiscing elit. Nulla dui turpis, convallis eget, lacinia id, vulputate ut, ipsum. Donec sed sem. Ut tempus. Nunc egestas consectetuer augue. Sed a nibh. Duis rutrum nibh. Sed in orci at arcu molestie ultrices. Quisque a lectus. In mollis, nulla id rutrum tincidunt, </div> <div class="jqCorner" style="background:#EDC2C2;color:black"> <h2 class="jqCorner" data-corner="round top" style="color:#ffffff;background:#aa0000"> 4. Lorem ipsum dolor sit amet </h2> Consectetuer adipiscing elit. Nulla dui turpis, convallis eget, lacinia id, vulputate ut, ipsum. Donec sed sem. Ut tempus. Nunc egestas consectetuer augue. Sed a nibh. Duis rutrum nibh. Sed in orci at arcu molestie ultrices. Quisque a lectus. In mollis, nulla id rutrum tincidunt, </div> %CLEAR%
E
dit
|
A
ttach
|
P
rint version
|
H
istory
: r1
|
B
acklinks
|
V
iew topic
|
Edit
w
iki text
|
M
ore topic actions
Topic revision: r1 - 12 Feb 2010,
ProjectContributor
System
Log In
or
Register
Toolbox
Users
Groups
Index
Search
Changes
Notifications
RSS Feed
Statistics
Preferences
User Reference
BeginnersStartHere
TextFormattingRules
Macros
FormattedSearch
QuerySearch
DocumentGraphics
SkinBrowser
InstalledPlugins
Admin Maintenance
Reference Manual
AdminToolsCategory
InterWikis
ManagingWebs
SiteTools
DefaultPreferences
WebPreferences
Categories
Admin Documentation
Admin Tools
Developer Doc
User Documentation
User Tools
Webs
Cerenkov
Pandacerenkov
DCS
Daq
Pandadaq
Detector
EMC
EMPAnalysis
Forwardstraws
GEM
MC
Magnet
Main
Mvd
PANDAMainz
PWA
Pbook
Personalpages
Physics
Baryons
CharmoniumAndExotics
HadronsInNuclei
OpenCharm
PhysicsCmt
SPC
STT
Sandbox
ScrutinyGroup
System
Tagpid
Pandatagpid
Tagtrk
Pandatagtrk
Target
ClusterJetTarget
Tof
WebServices
YoungScientists
ZArchives
Български
_jméno_jazyka
Dansk
Deutsch
English
Español
Suomi
Français
Italiano
日本語
한글
Nederlands
Norsk
Polski
Português
Português brasileiro
Русский
Svenska
简体中文
正體中文
Copyright © by the contributing authors. All material on this site is the property of the contributing authors.
Ideas, requests, problems regarding PANDA Wiki?
Send feedback