Difference between revisions of "Template:VidExpand"
(will test this with user-based CSS and, once it works flawlessly, ask for the CSS to be included globally.) |
m |
||
(6 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
− | <includeonly>[[{{{name|ERROR: VIDEO NAME MISSING}}}]] {{Init|{{{blogger}}}}} [[#{{{name|ERROR: VIDEO NAME MISSING}}}|<span title="Click to expand">& | + | <includeonly>[[{{{name|ERROR: VIDEO NAME MISSING}}}]] {{Init|{{{blogger}}}}} [[#{{{name|ERROR: VIDEO NAME MISSING}}}|<span title="Click to expand (except in IE)">∇</span>]]<span id="{{{name|ERROR: VIDEO NAME MISSING}}}-collapse"></span><br><div id="{{{name|ERROR: VIDEO NAME MISSING}}}" style="border: #668CFF 2px solid; background: #eeeeee; min-height: 60px; position: relative; top: 0px; left: 0px; margin-right: 8px;" class="vidExpandDiv"> |
{|width="100%" | {|width="100%" | ||
|rowspan="3" width="80px"|[[Image:{{{image|Channel icon.jpg}}}|80px|{{{name|ERROR: VIDEO NAME MISSING}}}]] | |rowspan="3" width="80px"|[[Image:{{{image|Channel icon.jpg}}}|80px|{{{name|ERROR: VIDEO NAME MISSING}}}]] | ||
Line 6: | Line 6: | ||
|{{{description|ERROR: DESCRIPTION MISSING}}} | |{{{description|ERROR: DESCRIPTION MISSING}}} | ||
|- | |- | ||
− | |style="font-size: x-small; text-align: right;"|Blogger: {{{blogger|ERROR: BLOGGER MISSING}}} - Date posted: {{{date|ERROR: DATE MISSING}}} - [{{{url|ERROR:URL MISSING}}} Watch] | + | |style="font-size: x-small; text-align: right;"|Blogger: [[{{{blogger|ERROR: BLOGGER MISSING}}}]] - Date posted: {{{date|ERROR: DATE MISSING}}} - [{{{url|ERROR:URL MISSING}}} Watch] [[#{{{name|ERROR: VIDEO NAME MISSING}}}-collapse|<span title="Collapse" style="position: absolute; bottom: -5px; right: 1px;">Δ</span>]] |
|}</div></includeonly> | |}</div></includeonly> | ||
− | <noinclude> | + | <noinclude>This template will generate an episode-link like the ones on [[List of Lonelygirl15 videos]], i.e. in the format [Name] [Blogger-Icon] - however, it will add another icon behind it: ∇.<br> |
− | This template will generate an episode-link like the ones on [[List of Lonelygirl15 videos]], i.e. in the format [Name] [Blogger-Icon] - however, it will add another icon behind it: & | + | This button, ''when clicked from within a browser supporting the :target pseudo-class'' (like Firefox, Camino, Opera, Safari, etc), will expand a block below the link showing episode data like image, description etc. Users with browsers not supporting :target (like Internet Explorer) will simply not be able to expand the links. This means, Internet Explorer users get the same as always, and users of just about every other browser get even more. No drawbacks for anyone. |
− | This button, ''when clicked from within a browser supporting the :target pseudo-class'' | + | |
==Usage== | ==Usage== | ||
<pre> | <pre> | ||
Line 44: | Line 43: | ||
|image=B_and_d.JPG | |image=B_and_d.JPG | ||
|description=Daniel here on Bree's account. I guess she showed up with Jonas to get me back. I had some help editing this video, it's all still a blur... | |description=Daniel here on Bree's account. I guess she showed up with Jonas to get me back. I had some help editing this video, it's all still a blur... | ||
− | |date=http://www.lonelygirl15.com/?p=184 | + | |date=February 10th, 2007 |
− | + | |url=http://www.lonelygirl15.com/?p=184 | |
}}</li> | }}</li> | ||
<li>{{VidExpand | <li>{{VidExpand | ||
Line 55: | Line 54: | ||
|url=http://www.lonelygirl15.com/?p=211 | |url=http://www.lonelygirl15.com/?p=211 | ||
}}</li></ol> | }}</li></ol> | ||
− | </noinclude> | + | [[Category:Templates|{{PAGENAME}}]]</noinclude> |
Latest revision as of 15:47, 8 April 2008
This template will generate an episode-link like the ones on List of Lonelygirl15 videos, i.e. in the format [Name] [Blogger-Icon] - however, it will add another icon behind it: ∇.
This button, when clicked from within a browser supporting the :target pseudo-class (like Firefox, Camino, Opera, Safari, etc), will expand a block below the link showing episode data like image, description etc. Users with browsers not supporting :target (like Internet Explorer) will simply not be able to expand the links. This means, Internet Explorer users get the same as always, and users of just about every other browser get even more. No drawbacks for anyone.
Usage
{{VidExpand |name= |blogger= |image= |description= |date= |url= }}
- name - name of this episode, the exact page title of its page
- blogger - who posted this episode
- image - name of a screencap from this episode (only the filename, no Image: prefix)
- description - episode description
- date - date when this video was posted
- url - full url to the video
Examples
The examples below use the live template - you can use them to test whether or not this template works for you.