Zebra-striping SharePoint Questions in SharePoint Survey

Achieving zebra striping in survey questions (helping users to distinguish between questions) is very easy with JQuery…

….you can add the following in the PlaceHolderAdditionalPageHead section in SharePoint Designer for NewForm.aspx and EditForm.aspx (simply copy the script and style sections below):

<asp:Content ContentPlaceHolderId="PlaceHolderAdditionalPageHead" runat="server">
	
	<style type="text/css">
		.oddrow { background : #eee9e9 !important;}
	</style>

	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
	<script type="text/javascript">
	$(document).ready(function () {
		$('td.ms-formbodysurvey table tbody tr:odd').addClass("oddrow");
	});
	</script>
	
	<SharePoint:UIVersionedContent UIVersion="4" runat="server"><ContentTemplate>
		<SharePoint:CssRegistration Name="forms.css" runat="server"/>
	</ContentTemplate></SharePoint:UIVersionedContent>
</asp:Content>

Advertisements