Complemento de bootstrap
1. Complemento de transición de bootstrap
El complemento de transición proporciona efectos de transición simples. Si desea hacer referencia a la funcionalidad del complemento individualmente, también deberá hacer referencia a Transition.js además de otros archivos JS. O, como se menciona en el capítulo de descripción general del complemento Bootstrap, puede consultar bootstrap.js o versiones comprimidas de bootstrap.min.js.
Transition.js es la clase de ayuda básica para el evento de transición y el simulador de efecto de transición CSS. Es utilizado por otros complementos para verificar el soporte del efecto de transición CSS y obtener el efecto de transición.
Casos de uso
Casos de uso del complemento de transición:
(1) Cuadro de diálogo modal con deslizamiento o efecto de desvanecimiento. Para ejemplos específicos, consulte el complemento Bootstrap Modal Box (modal).
(2) Página de etiqueta con efecto de desvanecimiento. Para ejemplos específicos, consulte el complemento de la página de pestaña Bootstrap (pestaña).
(3) Cuadro de advertencia con efecto de desvanecimiento. Para ejemplos específicos, consulte el complemento Bootstrap Warning Box (Alert).
(4) tablero de carrusel con efecto deslizante. Para ejemplos específicos, consulte el complemento Bootstrap Carousel.
2. Bootstrap Modal Box (modal) complemento
Un cuadro modal (modal) es una forma infantil que se superpone en la forma principal. Por lo general, el propósito es mostrar contenido de una fuente separada, que puede tener alguna interacción sin dejar la forma principal. La subformación puede proporcionar información, interacción, etc.
Si desea hacer referencia a la funcionalidad del complemento por separado, debe hacer referencia a Modal.js. O, como se menciona en el capítulo de descripción general del complemento Bootstrap, puede consultar bootstrap.js o versiones comprimidas de bootstrap.min.js.
(1) Uso
Puede alternar el contenido oculto del complemento de caja modal (modal):
A. A través del atributo de datos: Establezca el atributo datos-toggle = "modal" en el elemento controlador (como un botón o enlace), y establezca datos-Target = "#identificador" o href = "#identificador" para especificar el cuadro modal específico para cambiar (con id = "identificador").
B. A través de JavaScript: usando esta técnica, puede llamar a un cuadro modal con id = "identificador" a través de una línea simple de JavaScript:
$ ('#identificador'). Modal (opciones)
<H2> Crear un cuadro modal (modal) </h2> <!-El botón desencadena un cuadro modal-> <botón data-toggle = "modal" data-target = "#mymodal"> Comience a demostrar un cuadro modal </poton> <!-Modal Box (modal)-> <div ID = "myModal" tabindex = "-1" role = "dialog" aria-labeledbybybybybybybybybybybybybybybybybybybybybybybybybybybybybybybybybybybybybybybybybybybe aria-hidden = "true"> <div> <div> <div> <button type = "button" data-dismiss = "modal" aria-hidden = "true"> × </boton> <h4 id = "mymodallabel"> Box de modal (modal) Título </h4> </div> <div> Agregar un texto aquí </div> <iv> <divs> <divsy <boton type = "botón" button "button" button "Button" Button "Button" Button "Button" Button "Button" Button "Button" Button "Button" Button ". <botón tipo = "botón"> Enviar cambios </botón> </div> </div> </div> <!-/.modal-Content-> </div> <!-/.modal-> </div>
Explicación del código:
R. Usando ventanas modales, debe tener algún tipo de activación. Puede usar botones o enlaces. Aquí estamos usando botones.
B. Si observa cuidadosamente el código anterior, encontrará que en la etiqueta <botin>, data-target = "#mymodal" es el objetivo del cuadro modal que desea cargar en la página. Puede crear múltiples cuadros modales en la página y luego crear diferentes desencadenantes para cada cuadro modal. Ahora, es obvio que no puede cargar varios módulos al mismo tiempo, pero puede crear múltiples en la página para cargar en diferentes momentos.
C. Dos puntos a tener en cuenta en el cuadro modal:
El primero es .modal, que se usa para reconocer el contenido de <ViD> como un cuadro modal.
El segundo es la clase .fade. Cuando se cambia la caja modal, hace que el contenido se desvanezca.
D. Aria-Labelledby = "MyModallabel", esta propiedad se refiere al título de la caja modal.
E. La propiedad aria-hidden = "true" se usa para mantener la ventana modal invisible hasta que se active el disparador (como hacer clic en el botón relevante).
F, <Viv>, el cabeza de modal es una clase que define estilos para la cabeza de una ventana modal.
G, class = "Close", Close es una clase CSS que se usa para diseñar el botón Cerrar de una ventana modal.
H, Data-Dismiss = "Modal", es un atributo de datos HTML5 personalizado. Aquí se usa para cerrar la ventana modal.
I, class = "Modal-Body", es una clase CSS de Bootstrap CSS, que se usa para diseñar el cuerpo de una ventana modal.
J, class = "Footer modal", es una clase CSS de Bootstrap CSS, que se usa para peinar la parte inferior de la ventana modal.
K, Data-Toggle = "Modal", HTML5 Atributo de datos personalizados El toggle de datos se utiliza para abrir una ventana modal.
(2) Opciones
Hay opciones para personalizar la apariencia y la sensación de una ventana modal, que se pasan a través de propiedades de datos o JavaScript. La siguiente tabla enumera estas opciones:
(3) Método
Aquí hay algunos métodos útiles que se pueden usar con modal ().
(4) Evento
La siguiente tabla enumera los eventos que se utilizarán en el cuadro modal. Estos eventos se pueden usar como ganchos en las funciones.
3. Complemento de menú desplegable Bootstrap (desplegable)
El capítulo de menú desplegable Bootstrap explica el menú desplegable, pero no implica la parte de interacción. Este capítulo explicará la interacción del menú desplegable en detalle. Usando el complemento desplegable, puede agregar menús desplegables a cualquier componente (como barras de navegación, pestañas, menús de navegación cápsula, botones, etc.).
Si desea hacer referencia a la funcionalidad del complemento por separado, entonces debe hacer referencia a Downdown.js. O, como se menciona en el capítulo de descripción general del complemento Bootstrap, puede consultar bootstrap.js o versiones comprimidas de bootstrap.min.js.
(1) Uso
Puede alternar el contenido oculto del complemento del menú desplegable (desplegable):
Alterne el menú desplegable a través del atributo de datos: agregue Data-Toggle = "Discutiva" al enlace o botón.
A. Use el atributo de datos: agregue datos de datos = "desplegable" al enlace o botón para cambiar el menú desplegable, como se muestra a continuación:
<Div> <A data-toggle = "desplegable" href = "#"> disparador desplegable </a> <ul role = "menú" aria-labelledby = "dlabel"> </ul> </div>
B. Si necesita mantener el enlace intacto (útil cuando el navegador no habilita JavaScript), use la propiedad Data-Target en lugar de href = "#":
<div> <a id = "dlabel" role = "botón" data-toggle = "desplegable" data-target = "#" href = "/page.html"> menú desplegable (desplegable) <span> </span> </a> <ul role = "menú" Aria-LabelledBy = "dlabel"> </ul> </iv> Div>
C. A través de JavaScript: llame al menú desplegable a través de JavaScript, utilice el siguiente método: $ ('.
(2) Método
Hay una manera fácil de mostrar u ocultar el menú desplegable. $ (). desplegable ('toggle')
4. Complemento de scrollspy de bootstrap
El complemento de monitoreo de scroll (ScrollSpy), es decir, la actualización automática del complemento de navegación, actualizará automáticamente el objetivo de navegación correspondiente de acuerdo con la posición de la barra de desplazamiento. Su implementación básica es agregar una clase activa a la barra de navegación basada en la posición de barra de desplazamiento a medida que se desplaza.
(1) Uso
Puede agregar un comportamiento de escucha de desplazamiento a la navegación superior:
A. A través del atributo de datos: agregue datos-spy = "desplazarse" al elemento que desea escuchar (generalmente cuerpo). Luego agregue el Target de datos de atributo con la ID del elemento principal del componente Bootstrap .Nav o la propiedad de la clase. Para que funcione correctamente, debe asegurarse de que haya elementos en el cuerpo de la página que coincidan con la identificación del enlace que desea escuchar.
<Body data-spy = "scroll" data-target = ". Navbar-exame"> ... <div> <ul> ... </ul> </div> ... </body>
B. A través de JavaScript: puede llamar al monitoreo de desplazamiento a través de JavaScript, seleccione el elemento que se escuche y luego llame a la función .scrollspy ():
$ ('Body'). ScrollSpy ({Target: '.navbar-exame'})
(2) Opciones
Pasó a través de atributos de datos o JavaScript. La siguiente tabla enumera estas opciones:
(3) Método
.scrollspy ('actualizar'): al llamar al método ScrollSpy a través de JavaScript, debe llamar al método .refresh para actualizar el DOM. Esto es útil cuando se cambia cualquier elemento del DOM (es decir, agrega o elimina algunos elementos). Aquí está la sintaxis para usar este método.
$ ('[data-spy = "scroll"]'). Cada (function () {var $ spy = $ (this) .scrollspy ('refresh')})(4) Evento
La siguiente tabla enumera los eventos que se utilizarán en el desplazamiento de la escucha. Estos eventos se pueden usar como ganchos en las funciones.
5. complemento de pestaña Bootstrap (pestaña)
Las pestañas (pestaña) se introducen en el capítulo de elementos de navegación de bootstrap. Al combinar algunas propiedades de datos, puede crear fácilmente una interfaz de pestaña. Con este complemento, puede colocar contenido en una página de pestaña o en una página de pestaña de cápsula o incluso una página de pestaña de menú desplegable.
(1) Uso
Puede habilitar páginas de pestaña de dos maneras:
A. A través del atributo de datos: debe agregar datos de datos = "tab" o data-toggle = "píldora" al enlace de texto de anclaje. Agregar clases de NAV y NAV-Tabs a UL aplicará el estilo de etiqueta Bootstrap, agregando clases de NAV y Pills de NAV a UL aplicará el estilo de cápsula Bootstrap.
<ul>
<li> <a href = "#identificador" data-toggle = "tab"> inicio </a> </li>
...
</ul>
B. A través de JavaScript: puede usar JavaScript para habilitar las páginas de pestañas, como se muestra a continuación:
$ ('#mytab a'). Click (function (e) {e.preventDefault () $ (this) .tab ('show')})El siguiente ejemplo demuestra la activación de pestañas individuales de diferentes maneras:
// Seleccione la página de pestaña $ ('#mytab a [href = "#perfil"]'). Tab ('show') // Seleccione la primera página de pestaña $ ('#mytab a: primero'). Tab ('show') // Seleccione la última página de pestaña $ ('#mytab a: último'). Tab ('show') // Seleccione la tercera página de pestaña (indexada de 0) $ ('#mytab li (2 (2 (2). A '). Tab (' show ')(2) efecto de desvanecimiento
Si necesita establecer un efecto de desvanecimiento para la pestaña, agregue .fade a cada panel .tab. La primera pestaña debe agregarse con una clase .in para desvanecerse para mostrar el contenido inicial, como se muestra en el siguiente ejemplo:
<Viv> <div id = "home"> ... </div> <div id = "svn"> ... </div> </div>
(3) Método
. $ (). Tab: este método activa elementos de pestaña y contenedores de contenido. La página de pestañas debe usar un objetivo de datos o un href que apunte al nodo del contenedor en el DOM.
<ul id = "mytab"> <li> <a href = "#identificador" data-toggle = "tab"> home </a> </li> ..... </ul> <div> <divi Id = "home"> ... </div> .... </div> <script> $ (function () {$ ('#mytab a: último'). Tab (show)})(4) Evento
La siguiente tabla enumera los eventos que se utilizarán en el complemento de pestaña (pestaña). Estos eventos se pueden usar como ganchos en las funciones.
6. complemento Bootstrap Aval Tool (ToolTtip)
La información sobre herramientas es muy útil cuando desea describir un enlace. El complemento ToolTip está inspirado en jQuery.tipsy escrito por Jason Frame. El complemento ToolTip ha realizado muchas mejoras, como no confiar en las imágenes, sino usar CSS para lograr efectos de animación y usar atributos de datos para almacenar información del título.
(1) Uso
El complemento ToolTip genera contenido y etiquetas basadas en necesidades. Por defecto, la información sobre herramientas se coloca detrás de sus elementos de activación. Hay dos formas en que puede agregar una herramienta de inmediato (ToolTip):
A. A través del atributo de datos: si necesita agregar una herramienta de solicitud (Inscitación de herramientas), simplemente agregue Data-Toggle = "ToolTiP" a una etiqueta de anclaje. El título del ancla es el texto de la herramienta de inmediato (ToolTiP). Por defecto, el complemento establece la información sobre herramientas en la parte superior.
<a href = "#" data-toggle = "tooltip" title = "Ejemplo ToolTip"> Por favor, pasee por mi </a>
A. A través de JavaScript: activar la herramienta de solicitud (ToolTip) a través de JavaScript: $ ('#identificador'). ToolTip (Opciones)
El complemento ToolTip no es como los menús desplegables y otros complementos discutidos anteriormente, no es un complemento CSS puro. Para usar el complemento, debe activarlo usando jQuery (leer JavaScript). Use el siguiente script para habilitar todas las herramientas de inmediato (información sobre herramientas) en la página:
$ (function () {$ ("[data-toggle = 'tooltip']"). tooltip ();});
<a href = "#" data-toggle = "tooltip" data-placation = "left"> tooltip a la izquierda </a>. <a href = "#" data-toggle = "tooltip" data-placation = "top"> toolTip en la parte superior </a>. <botón type = "botón" data-toggle = "tooltip" data-placation = "fondo" title = "tooltip"> tooltip en el fondo </botón>
(2) Opciones
Hay algunas opciones que se agregan a través de la API de datos de Bootstrap (API de datos Bootstrap) o se llaman a través de JavaScript. La siguiente tabla enumera estas opciones:
(3) Método
Aquí hay algunos métodos útiles en los complementos de información sobre herramientas:
(4) Evento
La siguiente tabla enumera los eventos que se utilizarán en el complemento ToolTip. Estos eventos se pueden usar como ganchos en las funciones.
7. complemento Bootstrap Popover
Un Popover es similar a una información sobre herramientas, que proporciona una vista extendida. Para activar el cuadro emergente, el usuario solo necesita pasar el elemento. El contenido del cuadro emergente se puede poblar por completo utilizando la API de datos de Bootstrap (API de datos Bootstrap). Este método se basa en información sobre herramientas. Si desea hacer referencia a la funcionalidad del complemento por separado, debe hacer referencia a Popover.js, que se basa en el complemento ToolTip.
(1) Uso
El complemento Popover genera contenido y etiquetas basadas en necesidades. Por defecto, los popoveres se colocan detrás de sus elementos de activación. Puede agregar popovers de dos maneras:
A. A través del atributo de datos: si desea agregar un Popover, simplemente agregue Data-Toggle = "Popover" a una etiqueta de anclaje/botón. El título del ancla es el texto del Popover. Por defecto, el complemento establece el Popover en la parte superior.
<a href = "#" data-toggle = "Popover" title = "Ejemplo Popover">
Por favor, pasee por encima de mi
</a>
B. a través de JavaScript: Enable Popover (Popover) a través de JavaScript: $ ('#identificador'). Popover (Opciones)
El complemento Popover no es como los menús desplegables y otros complementos discutidos anteriormente, no es un complemento CSS puro. Para usar el complemento, debe activarlo usando jQuery (leer JavaScript). Use el siguiente script para habilitar todos los poblados en la página:
$ (function () {$ ("[data-toggle = 'popover']"). popover ();});
<botón type = "botón"
Data-Container = "Body" Data-Toggle = "Popover" data-placation = "izquierda" Content = "Algún contenido en Popover a la izquierda" > Popover a la izquierda
</botón>
(2) Opciones
Hay algunas opciones que se agregan a través de la API de datos de Bootstrap (API de datos Bootstrap) o se llaman a través de JavaScript. La siguiente tabla enumera estas opciones:
(3) Método
Aquí hay algunos métodos útiles en complementos de Popover:
(4) Evento
La siguiente tabla enumera los eventos que se utilizarán en el complemento emergente (Popover). Estos eventos se pueden usar como ganchos en las funciones.
8. complemento de bootstrap de advertencia (alerta)
Los mensajes de alerta se utilizan principalmente para querer que el usuario final muestre información como advertencia o mensajes de confirmación. Usando el complemento de alerta, puede agregar una función cancelable a todos los mensajes de cuadro de advertencia.
(1) Uso
Puede habilitar la función de despido del cuadro de advertencia de las siguientes dos maneras:
A. A través de los atributos de datos: agregue una función cancelable a través de la API de datos (API de datos). Simplemente agregue Data-Dismiss = "Alerta" al botón Cerrar, y la función de cierre se agregará automáticamente al cuadro de advertencia.
<a data-dismiss = "alerta" href = "#" aria-hidden = "true">
×
</a>
B. A través de JavaScript: Agregar funciones canceladas a través de JavaScript: $ (". Alert"). Alert ()
<div> <a href = "#" data-dismiss = "alerta"> × </a> <strong> Advertencia! </strong> su conexión de red tiene un problema. </div>
(2) Método
Aquí hay algunos métodos útiles en el complemento de alerta:
(3) Evento
La siguiente tabla enumera los eventos que se utilizarán en el complemento de alerta. Estos eventos se pueden usar como ganchos en las funciones.
9. complemento de botones de arranque
Con el complemento de botones, puede agregar algunas interacciones, como controlar el estado del botón o crear grupos de botones para otros componentes, como barras de herramientas.
(1) Estado de carga
Para agregar el estado de carga al botón, simplemente agregue datos-carga-text = "Cargando ..." al elemento del botón como su atributo.
<botón id = "fat-btn" data-carga-text = "carging ..." type = "botón"> estado de carga </boton> <script> $ (function () {$ (". Btn"). Click (function () {$ (this) .button ('carging'). demandado (1000).(2) interruptor único
Para activar el interruptor de un solo botón (es decir, para cambiar el estado normal del botón al estado de presionar, y viceversa), simplemente agregue datos de datos = "botón" al elemento del botón como su atributo.
<botón tipo = "botón" data-toggle = "botón"> Switch Switch </Button>
(3) casilla de verificación
Puede crear un grupo de casilla de verificación y agregar una alternancia al grupo de casilla de verificación agregando el atributo de datos de datos de datos = "botones" al grupo BTN.
<DivData-Toggle = "Botones"> <label> <input type = "CheckBox"> Opción 1 </label> <label> <input type = "CheckBox"> Opción 3 </selabel> </div>
(4) Botón de radio (radio)
Del mismo modo, puede crear un grupo de botones de radio y agregar una palanca para el grupo de botones de radio agregando el atributo de datos de datos de datos = "botones" a BTN-Group.
(5) Método
Aquí hay algunos métodos útiles en los complementos de botones:
10. complemento de colapso de bootstrap
El complemento de colapso facilita el plegado del área de la página. Ya sea que lo use para crear una navegación colapsada o un panel de contenido, permite muchas opciones de contenido.
(1) Cree un panel de agrupación o plegable plegable, como se muestra a continuación:
<div id = "acorkion"> <div> <div> <h4> <a data-toggle = "colapso" data-parent = "#acorkion" href = "#colapso"> Haga clic en expandirme, haga clic para colapsar nuevamente. Parte 1 </a> </h4> </div> <div id = "colapso"> <div> nihil anim keffiyeh helvetica, trabajo de cerveza artesanal Wes Anderson cred nesciunt sapiente ea proident. AD Vegan Excepto Butcher Vice Lomo. </div> </div> </div> </div>
A. Data-toggle = "colapso" Agregar al enlace del componente que desea expandir o colapsar.
La propiedad B, HREF o Data-Target se agrega al componente principal, y su valor es la ID del componente infantil.
C. La propiedad de los datos-parentes agrega la ID del panel plegado al enlace del componente a expandirse o colapsarse.
(2) Cree un componente plegable simple sin la etiqueta de acordeón, como se muestra a continuación:
<botón tipo = "botón" data-toggle = "colapse" data-target = "#demo"> componente plegable simple </boton> <div id = "demo"> nihil anim keffiyeh helvetica, trabajo de cerveza artesanal wes anderson cred nesciunt sapiente ea proident. Ad vegano excepto el carnicero vice Lomo. </div>
(3) Uso
La siguiente tabla enumera el complemento de colapso para manejar una escala pesada:
Puede usar el complemento de colapso de dos maneras:
A. A través del atributo de datos: agregue datos-toggle = "colapso" y el objetivo de datos al elemento para asignar automáticamente controles a elementos plegables. La propiedad del objetivo de datos acepta un selector CSS y aplica un efecto de colapso. Asegúrese de agregar clase .Collapse al elemento plegable. Si desea que esté encendido de forma predeterminada, agregue una clase adicional .in.
Para agregar una administración de agrupación plegada en forma de panel al control plegable, agregue la propiedad de datos datos-parent = "#selector".
B. A través de JavaScript: el método de colapso se puede activar a través de JavaScript, como se muestra a continuación: $ ('. Colapso'). Colapso ()
11. complemento de carrusel de bootstrap
El complemento Bootstrap Carousel es una forma flexible y receptiva de agregar controles deslizantes a un sitio. Además de eso, el contenido es lo suficientemente flexible como para ser una imagen, un marco incrustado, un video o cualquier otro tipo de contenido que desee colocar.
<div id="myCarousel"> <!-- Carousel indicator--> <ol> <li data-target="#myCarousel" data-slide-to="0"></li> <li data-target="#myCarousel" data-slide-to="1"></li> <li data-target="#myCarousel" data-slide-to="2"></li> </ol> < src = "/wp-Content/uploads/2014/07/slide3.png"> <div> title 3 </div> </div> </div> <!-Carousel Navigation-> <a href = "#myCarousel" data-slide = ""> ‹‹/a> <a href = "#myCarousel" sharusel = ""
(1) Uso
A. A través del atributo de datos: utilizando los atributos de datos, es fácil controlar la posición del carrusel.
El deslizamiento de datos de la propiedad acepta la palabra clave anterior o al lado para cambiar la posición de la diapositiva en relación con la posición actual.
Use datos de deslizamiento para un índice de deslizamiento en bruto en la parte inferior del lecho del carrusel. Data-Slide-To = "2" moverá el control deslizante a un índice específico, y el índice cuenta desde 0.
La propiedad Data-Ride = "Carousel" se utiliza para marcar el carrusel que inicia la reproducción de animación cuando se carga la página.
B. A través de JavaScript: Carousel se puede llamar manualmente a través de JavaScript, como se muestra a continuación: $ ('. Carousel). Carousel ()
(2) Opciones
Hay algunas opciones que se pasan a través de propiedades de datos o JavaScript. La siguiente tabla enumera estas opciones:
(3) Método
Aquí hay algunos métodos útiles en los complementos de carrusel:
(4) Evento
La siguiente tabla enumera los eventos que se utilizarán en el complemento de Carousel. Estos eventos se pueden usar como ganchos en las funciones.
12. complemento de navegación adicional (Affix) de bootstrap (Affix)
El complemento de navegación adicional (Afix) permite que un <div> se fije en algún lugar de la página. También puede alternar entre activar o apagar con el complemento. Un ejemplo común son los íconos sociales. Comenzarán en algún lugar, pero cuando la página haga clic en una marca, <Div> se bloqueará en algún lugar y no se desplazará junto con el resto de la página.
(1) Uso
Puede usar el complemento de navegación adjunto (Aftix) a través de propiedades de datos o a través de JavaScript.
A través de los atributos de datos: si necesita agregar un comportamiento de navegación adicional (Afix) al elemento, solo necesita agregar Data-Spy = "Affix" al elemento que necesita escuchar. Use compensaciones para definir cuando alterne el bloqueo y el movimiento de los elementos.
(2) A través de JavaScript: puede agregar manualmente la navegación adicional (Afix) a un elemento a través de JavaScript, como se muestra a continuación:
$ ('#myaffix'). Affix ({offset: {top: 100, fondo: function () {return (this.bottom = $ ('. BS-Footer'). OuterHeight (true))}})(3) Posicionamiento a través de CSS
En las dos formas anteriores de usar el complemento Aftix, debe localizar contenido a través de CSS. El complemento de navegación adicional (Aftix) cambia entre tres clases, cada una de las cuales presenta un estado específico: .Affix, .Affix-top y .Affix-Bottom. Siga los pasos a continuación para configurar su propio CSS para estos tres estados (no confiar en este complemento).
R. Al principio, el complemento agrega .Affix-top para indicar el elemento en su posición más alta. No se requiere posicionamiento CSS en este momento.
B. Al desplazarse a través del elemento que agrega navegación adicional (Afix) debe activarse. En este momento, .Affix reemplazará .Affix-top y establecerá la posición: fijo; (proporcionado por el código CSS de Bootstrap).
C. Si se define el desplazamiento inferior, cuando el pergamino alcanza esta posición, reemplace .Affix con .fix-fondo. Dado que el desplazamiento es opcional, si se establece el desplazamiento, se requiere un CSS apropiado para establecerse al mismo tiempo. En este caso, agregue la posición: Absoluto; si es necesario.
(4) Opciones
Hay algunas opciones que se pasan a través de propiedades de datos o JavaScript. La siguiente tabla enumera estas opciones:
Este artículo se ha compilado en el "Tutorial de uso de complementos de bootstrap", y todos son bienvenidos a aprender y leer.
Lo anterior es todo el contenido de este artículo. Espero que sea útil para el aprendizaje de todos y espero que todos apoyen más a Wulin.com.