Styleswitcher and re-assessing the height of a dom element afterwards.... Resolved
Hi,
I've got some style switching code for large text / high contrast.
After applying this new style sheet, I want to recalculate the height of an object based on it's content. I don't want to fix this content's height as it is managed by cms and changes regularly.
The problem is that after the text is enlarged and the element (.column-content) increases in height, I am still returned the old height i.e. although the new css is applied on the screen, my jQuery is not returning the new height. I suppose my question, at what stage can I run my function and have it return the new increased height from the styleswitcher.
Here's my style switcher including my footerHeights function which should reassess the height of the element:
- /*
- ====================================
- Style switcher
- ====================================
- */
- $('.styleswitch').click(function()
- {
- relattrib = this.getAttribute("rel");
- switchStylestyle(this.getAttribute("rel"));
- footerHeights()
- return false;
- });
-
- var style = readCookie('style');
- if(style) {
- switchStylestyle(style);
- footerHeights()
- }
- function switchStylestyle(styleName)
- {
- $('link[@rel=*style][title]').each(function(i)
- {
- this.disabled = true;
- if(this.getAttribute('title') == styleName)
- this.disabled = false;
- });
- largeStyle = styleName;
-
- createCookie('style',styleName,365);
- }
- function createCookie(name,value,days)
- {
- if(days)
- {
- var date = new Date();
- date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
- var expires = "; expires=" + date.toGMTString();
- }
- else
- var expires = "";
- document.cookie = name + "=" + value + expires + "; path=/";
- }
- function readCookie(name)
- {
- var nameEQ = name + "=";
- var ca = document.cookie.split(';');
- for(var index = 0; index < ca.length; index++)
- {
- var c = ca[index];
- while(c.charAt(0 )== ' ')
- c = c.substring(1,c.length);
- if(c.indexOf(nameEQ) == 0)
- return c.substring(nameEQ.length,c.length);
- }
- return null;
- }
- function eraseCookie(name)
- {
- createCookie(name,"",-1);
- }
- /*
- ====================================
- Resize column content
- ====================================
- */
- function footerHeights()
{
var max_height = 0;
$("#footer .column-content").each
(
function (i)
{
alert($(this).height());
if ($(this).height() > max_height)
max_height = $(this).height();
}
);
$("#footer .column-content").height(max_height);
}
Thanks in advance!
Nick