 |
Home: Support: Reference Guide: Image Tags | Questions? Comments? Please write support@desert.net. |
|
Image Tags
The image tags allow you to get to access all the given information on a particular image or series of images. They are most commonly used to define an image macro, but can also be used independently for precision image placement and manipulation. For more information on image macros, see <dpStory>.
<dpImage>
D E F I N I T I O N:
Returns <img src="file.gif" width="100" height="220" alt="alt value">. In addition, you can push through any other values you want. The image tag will ignore everything but the number attribute and will just send your extras along.
<dpImage
number="#"
>
E X A M P L E S:
<dpImage number="#" align="right">
returns
<img src="file.gif" width="100" height="220" alt="alt value" align="right">
<dpImage number="#" align="left" onmouseover="doSomething()">
returns
<img src="file.gif" width="100" height="220" alt="alt value" align="left" onmouseover="doSomething()">
You can also override values as follows:
<dpImage number="#" width="5">
returns <img src="file.gif" width="5" height="220" alt="alt value">
Testing Image Sizes for Layout
If you want to have wide images centered and other images aligned on the right, you can do this with an image macro. The following macro tests to see if the image width is greater than 350 pixels. If it is, it uses a centering layout. If it isn't that wide, the macro aligns the image on the right.
T A G C O D E:
<dpMacro myImageLayout>
<dpIf <dpImageWidth> gt 350>
<p>
<center>
<dpImage>
</center>
<p>
<dpElse>
<dpImage align="right">
</dpIf>
</dpMacro>
<dpStory images="on" imageMacro="myImageLayout">
E F F E C T:
Passing JavaScript or other Attributes on to Images
You may pass an "onMouseOver" event or a "vspace" on to an image associated with a story.
T A G C O D E:
You can do this longhand:
<img src="<dpImageURL>" width="<dpImageWidth>" height="<dpImageHeight>" alt="<dpImageAlt>" onMouseOver="do something" vspace="10">
or you can do it shorthand:
<dpImage onMouseOver="do something" vspace="10">
Both examples produce identical results. <dpImage> provides a shorthand that always fills out the width, height, and alt attributes as well as creating an image tag. You can pass other values on to it or override existing values by adding attributes to the tag.
Here's an example of forcing the alt of all images to display the caption.
<dpImage alt="<dpImageCaption>">
E F F E C T:
<dpImageAlt>
D E F I N I T I O N:
Returns the alt value of the specified image.
<dpImageAlt
number="#"
default="default text"
style="lower|upper|title|spaced|roman|decimal|identifier|
noHtml|noHtmlStyle|scriptEncode|uriEncode"
link="on|off"
start="#p|#s|#w|#c|begin|end|resume"
stop="#p|#s|#w|#c|begin|end|resume"
length="#p|#s|#w|#c|begin|end"
>
A T T R I B U T E S:
Please refer to the common attributes page for the common attribute descriptions.
<dpImageArtist>
D E F I N I T I O N:
Returns the artist of a specific image referenced by the number. For example, if a story had three images, you would reference the second image's artist as follows: <dpImageArtist number="2">.
<dpImageArtist
default="default text"
number="#|all"
style="lower|upper|title|spaced|roman|decimal|identifier|
noHtml|noHtmlStyle|scriptEncode|uriEncode"
link="on|off"
start="#p|#s|#w|#c|begin|end|resume"
stop="#p|#s|#w|#c|begin|end|resume"
length="#p|#s|#w|#c|begin|end"
>
A T T R I B U T E S:
Please refer to the common attributes page for the common attribute descriptions.
<dpImageCaption>
D E F I N I T I O N:
Returns the caption of a specific image referenced by the number. For example, if a story had three images, you would reference the second image's caption as follows: <dpImageCaption number="2">.
<dpImageCaption
number="#"
default="default text"
style="lower|upper|title|spaced|roman|decimal|identifier|
noHtml|noHtmlStyle|scriptEncode|uriEncode"
link="on|off"
start="#p|#s|#w|#c|begin|end|resume"
stop="#p|#s|#w|#c|begin|end|resume"
length="#p|#s|#w|#c|begin|end"
>
A T T R I B U T E S:
Please refer to the common attributes page for the common attribute descriptions.
<dpImageCount>
D E F I N I T I O N:
Returns the number of images the story has associated with it. For example, if a story had three images, <dpImageCount> would return "3".
<dpImageCount
default="default text"
style="lower|upper|title|spaced|roman|decimal|identifier|
noHtml|noHtmlStyle|scriptEncode|uriEncode"
link="on|off"
start="#p|#s|#w|#c|begin|end|resume"
stop="#p|#s|#w|#c|begin|end|resume"
length="#p|#s|#w|#c|begin|end"
>
A T T R I B U T E S:
Please refer to the common attributes page for the common attribute descriptions.
<dpImageCredit>
D E F I N I T I O N:
Returns the credit type of the artist, for the specific image referenced by the number. Example return values include "Photo by" and "Illustration by".
<dpImageCredit
number="#"
default="default text"
style="lower|upper|title|spaced|roman|decimal|identifier|
noHtml|noHtmlStyle|scriptEncode|uriEncode"
link="on|off"
start="#p|#s|#w|#c|begin|end|resume"
stop="#p|#s|#w|#c|begin|end|resume"
length="#p|#s|#w|#c|begin|end"
>
A T T R I B U T E S:
Please refer to the common attributes page for the common attribute descriptions.
<dpImageHeight>
D E F I N I T I O N:
Returns the height of the specified image.
<dpImageHeight
number="#"
default="default text"
style="lower|upper|title|spaced|roman|decimal|identifier|
noHtml|noHtmlStyle|scriptEncode|uriEncode"
link="on|off"
start="#p|#s|#w|#c|begin|end|resume"
stop="#p|#s|#w|#c|begin|end|resume"
length="#p|#s|#w|#c|begin|end"
>
A T T R I B U T E S:
Please refer to the common attributes page for the common attribute descriptions.
<dpImageID>
D E F I N I T I O N:
Returns the base file name of the image. No suffix.
<dpImageID
default="default text"
style="lower|upper|title|spaced|roman|decimal|identifier|
noHtml|noHtmlStyle|scriptEncode|uriEncode"
link="on|off"
start="#p|#s|#w|#c|begin|end|resume"
stop="#p|#s|#w|#c|begin|end|resume"
length="#p|#s|#w|#c|begin|end"
>
A T T R I B U T E S:
Please refer to the common attributes page for the common attribute descriptions.
E X A M P L E S:
<dpImageURL> returns feature1-2.gif
<dpImageID> returns feature1-2
<dpImageNumber>
D E F I N I T I O N:
Returns the number of the "current" image. This would most commonly be used in an image macro to test for a specific image. For example, if it was the first image you may want to do something specific, or the last image.
<dpImageNumber
default="default text"
style="lower|upper|title|spaced|roman|decimal|identifier|
noHtml|noHtmlStyle|scriptEncode|uriEncode"
link="on|off"
start="#p|#s|#w|#c|begin|end|resume"
stop="#p|#s|#w|#c|begin|end|resume"
length="#p|#s|#w|#c|begin|end"
>
A T T R I B U T E S:
Please refer to the common attributes page for the common attribute descriptions.
E X A M P L E S:
<dpIf <dpImageNumber> = 1>
tests if it is the first image
special treatment for the first image
<dpElseIf <dpImageNumber> = <dpImageCount>>
tests if it is the last image
special treatment for the last image
<dpElse>
default treatment (not the first or last image)
</dpIf>
<dpImageURL>
D E F I N I T I O N:
Returns the URL of the specified image. For example <dpImageURL number="1"> would return "feature2-1.gif".
<dpImageURL
number="#"
default="default text"
style="lower|upper|title|spaced|roman|decimal|identifier|
noHtml|noHtmlStyle|scriptEncode|uriEncode"
link="on|off"
start="#p|#s|#w|#c|begin|end|resume"
stop="#p|#s|#w|#c|begin|end|resume"
length="#p|#s|#w|#c|begin|end"
>
A T T R I B U T E S:
Please refer to the common attributes page for the common attribute descriptions.
<dpImageWidth>
D E F I N I T I O N:
Returns the width of the specified image.
<dpImageWidth
number="#"
default="default text"
style="lower|upper|title|spaced|roman|decimal|identifier|
noHtml|noHtmlStyle|scriptEncode|uriEncode"
link="on|off"
start="#p|#s|#w|#c|begin|end|resume"
stop="#p|#s|#w|#c|begin|end|resume"
length="#p|#s|#w|#c|begin|end"
>
A T T R I B U T E S:
Please refer to the common attributes page for the common attribute descriptions.
|
Home: Support: Reference Guide: Image Tags | Questions? Comments? Please write support@desert.net. |
|