jQuery problema scrollTop

Front-end
#1

Estou querendo fazer com que uma DIV que após se feito o scroll vai aparecer, tipo a do Submarino
no entanto está dando problema dentro do template e no p:layout o valor do scroll vem sempre 0 (zero),
em uma pagina vazia, sem template e layout, funciona que é uma beleza
alguém se arriscaria a dizer o porque?
essa é a pagina:

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	template="/pages/administrador/templateAdministrador.xhtml">

	<ui:define name="conteudo">
		<script src="http://code.jquery.com/jquery-1.9.1.js" />

		<script type="text/javascript">
		jQuery.noConflict();
		$(document).ready(function(){
			   $("#topo").click(function(){
					alert($(window).scrollTop()); // SEMPRE RETORNA ZERO
			   });  
});
</script>

		<h:form id="frmConteudo">
			<p:breadCrumb>
				<p:menuitem />
				<p:menuitem value="#{msg.tipoUsuario}" id="button" />
			</p:breadCrumb>

			<div id="topo">
				<p:panel>
					<p:commandButton title="#{msg.novo}" action="#"
						icon="ui-icon-plusthick" />

					<p:commandButton title="#{msg.salvar}" action="#"
						icon="ui-icon-disk" />

					<p:commandButton title="#{msg.excluir}" action="#"
						icon="ui-icon-minusthick" />
					<p:commandButton value="X" title="fechar" />

				</p:panel>
			</div>

			<p:spacer width="100%" height="5px;" />

			<p:fieldset legend="#{msg.cadastro}">
				<h:panelGrid columns="3" id="pnDados">
					<h:outputText value="#{msg.descricao}:" />
					<p:inputText id="inDesc"
						value="#{tipoUsuarioMB.baseEntity.descricao}" required="true"
						requiredMessage="#{msg.descricao} #{msg.obrigatorio}" />
					<p:message for="inDesc" />

					<h:outputText value="#{msg.sigla}:" />
					<p:inputText id="inSigla" maxlength="1"
						style="text-transform:uppercase;"
						value="#{tipoUsuarioMB.baseEntity.sigla}" required="true"
						requiredMessage="#{msg.sigla} #{msg.obrigatorio}" />
					<p:message for="inSigla" />
				</h:panelGrid>
				<p:messages autoUpdate="true" globalOnly="true" />

				<div id="conteudo" align="center">
					a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />
					a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />a<br />
				</div>

				<h:panelGrid id="pnBotoes" columns="3">

					<p:commandButton value="#{msg.novo}" action="#{tipoUsuarioMB.novo}"
						icon="ui-icon-plusthick" process="@this" update="pnDados" />

					<p:commandButton value="#{msg.salvar}"
						action="#{tipoUsuarioMB.salvar}" icon="ui-icon-disk"
						process=":frmConteudo" update="@form" />

					<p:commandButton value="#{msg.excluir}"
						action="#{tipoUsuarioMB.excluir}" icon="ui-icon-minusthick"
						process="@form" update="@form" />

				</h:panelGrid>

			</p:fieldset>

			<p:fieldset>

				<p:dataTable id="grid" value="#{tipoUsuarioMB.listEntity}" var="tp"
					selectionMode="single" selection="#{tipoUsuarioMB.baseEntity}"
					rowKey="#{tp.id}">
					<p:ajax event="rowSelect" process="@this"
						update=":frmConteudo:pnDados" />

					<p:column headerText="#{msg.sigla}">
						<h:outputText value="#{tp.sigla}" />
					</p:column>

					<p:column headerText="#{msg.descricao}">
						<h:outputText value="#{tp.descricao}" />
					</p:column>
				</p:dataTable>
			</p:fieldset>
		</h:form>
	</ui:define>
</ui:composition>
#2