/ / Prevenir a la FOUC en el contexto de un sitio web de Kentico 10 - zurb-foundation, kentico

Prevenir la FOUC en el contexto de un sitio web de Kentico 10 - zurb-foundation, kentico

Fundación Zurb recomienda añadiendo class = "no-js" a la etiqueta html de la página para prevenir contra Flash de contenido sin estilo (FOUC).

Estamos utilizando Kentico CMS. Estoy buscando la "manera de Kentico" de agregar una clase a la html Etiqueta de elemento en la página maestra. Estamos utilizando el motor del portal CMS.

Para que vamos <html class="no-js"

Está dispuesto a volver a caer en ASP.NET si no hay una forma más accesible de usar macros de Kentico o su API.

Respuestas:

3 para la respuesta № 1

En su plantilla de portal de la página maestra puede agregar un código como este para realizar esa modificación:

<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (CurrentDocument != null)
{
CMS.UIControls.ContentPage page= this.Page as CMS.UIControls.ContentPage;
if (page != null)
{
page.XmlNamespace += " class="no-js"";
}
}
}
</script>

También puede modificar la página CMSPagesPortalTemplate.aspx también, pero Kentico no lo admite o recomienda, ya que normalmente rompe la ruta de actualización.


1 para la respuesta № 2

La forma más rápida que conozco es modificar CMSPagesPortalTemplate.aspx para agregar su clase allí.

<%@ Page Language="C#" AutoEventWireup="true" Inherits="CMSPages_PortalTemplate" ValidateRequest="false" MaintainScrollPositionOnPostback="true" EnableEventValidation="false" Codebehind="PortalTemplate.aspx.cs" %>

<%=DocType%>
<html <%=XHtmlNameSpace%> <%=XmlNamespace%> class="no-js">
<head id="head" runat="server" enableviewstate="false">
...

0 para la respuesta № 3

El "no-js" es un valor por defecto. Si, de hecho, su navegador SOPORTA JavaScript, la clase "no-is" será eliminada por el motor Modernizr.

Modernizr es una biblioteca de JavaScript que verificará las capacidades del navegador y actualizará la mención html class = "”.

Por ejemplo, si su navegador es compatible con la tecnología flexbox, la clase flexbox se agregará a la lista de clases html. De lo contrario, se agregará la clase no-flexbox.

Más adelante, cuando se usa el marco CSS (Bootstrap o Foundation), se pueden usar algunas estrategias para emular una característica que falta.


preguntas relacionadas


Comentarios (0)

Añadir un comentario