phpwcms Support Forum

Code: Select all

<!--IMAGES_HEADER_START//-->

[TITLE]<h3>{TITLE}</h3>[/TITLE]
[SUBTITLE]<h4>{SUBTITLE}</h4>[/SUBTITLE]
[TEXT]{TEXT}[/TEXT]

<div class="images" id="images{ID}">
<!--IMAGES_HEADER_END//-->

<!--IMAGES_ENTRY_START//-->

[PHP]
$GLOBALS['block']['css']['cornerframed'] = 'specific/cornerframed.css';
$GLOBALS['block']['custom_htmlhead']['cornerframed'] = '  <script type="text/javascript">
// RCS added: escapes and ID and CDATA stuff. Original script stolen from: http://www.sitepoint.com/examples/rounded_images/
//* <![CDATA[ *//
//window.addEvent(\'domready\', function() {						//commented. perhaps someone will get it going?
function roundedImages() {
	var content = document.getElementById(\'images{ID}\');	//here the necessary ID will be inserted (RCS)
	var imgs = content.getElementsByTagName(\'img\');
 
	for (var i = 0; i < imgs.length; i++) {								// start loop 

		var wrapper = document.createElement(\'div\');				// Create the outer-most div (wrapper)
		wrapper.className = \'rwrapper\';										// Give it a classname - wrapper
		wrapper.style.width = imgs[i].width+\'px\';					// give wrapper the same width as the current img
		var original = imgs[i];															// take the next image  
		//Swap out the original img with our wrapper div (we will put it back later)
		if(original.parentNode.tagName.toUpperCase()==\'A\') original = original.parentNode;	// if you link the image this will help the script find the right parent wrapper
		original.parentNode.replaceChild(wrapper, original);
		// IE crash fix - c/o Joshua Paine - http://fairsky.us/home

		//Create the four other inner nodes and give them classnames
		var tl = document.createElement(\'div\');
		tl.className = \'tl\';
		var br = document.createElement(\'div\');
		br.className = \'br\';
		var tr = document.createElement(\'div\');
		tr.className = \'tr\';
		var bl = document.createElement(\'div\');
		bl.className = \'bl\';
		
		//Glue the nodes back inside the wrapper
		wrapper.appendChild(tl);
		wrapper.appendChild(tr);
		wrapper.appendChild(bl);
		wrapper.appendChild(br);
		
		//And glue the img back in after the DIVs
		wrapper.appendChild(original);
	}
}
//});																											//commented
//Run the function once the page has loaded:

	window.onload = roundedImages;

//* ]]> *//
</script>'
[/PHP]

	<div class="imageEntry" id="img{IMGID}" style="float:left;padding:0;border:0px solid #CCCCCC;margin:0.5em 0.5em 0 0;" >
	        {IMAGE}
	</div>

<!--IMAGES_ENTRY_END//-->

<!--IMAGES_ENTRY_SPACER_START//--><!-- space between images "{SPACE}px" --><!--IMAGES_ENTRY_SPACER_END//-->
<!--IMAGES_ROW_SPACER_START//--><br style="clear:both" /><!-- space between image rows --><!--IMAGES_ROW_SPACER_END//-->

<!--IMAGES_FOOTER_START//-->
	<br style="clear:both" />
</div>
<!--IMAGES_FOOTER_END//-->

Code: Select all

/* CSS Document */
div.rwrapper {
	margin:3px;
	position:relative;
	float:left;
	vertical-align:top;
}
div.rwrapper img{	
	float:left;
	border:0 none;
}
div.rwrapper div{	
	position:absolute;
	left:0;
	height:7px;
	width:100%
}
div.rwrapper div.tl{
	background:transparent url(/pics/tl.gif) top left no-repeat;
	top:0
}
div.rwrapper div.tr{
	background:transparent url(/pics/tr.gif) top right no-repeat;
	top:0;
	}

div.rwrapper div.bl{
	background:transparent url(/pics/bl.gif) bottom left no-repeat;
	bottom:0
}
div.rwrapper div.br{
	background:transparent url(/pics/br.gif) bottom right no-repeat;
	bottom:0;
}

Code: Select all

var content = document.getElementById('images504');   //here the necessary ID will be inserted (RCS)