Desativar elemento de ponte na tela de carregamento do FiveM

Este tutorial explica como remover a ponte da tela de carregamento do servidor FiveM
criando ou modificando um recurso de tela de carregamento.

Pré-requisitos

Acesso ao servidor FiveM com permissões de modificação de recursos
Noções básicas de HTML/CSS
um editor de texto como Bloco de notas++ (ou o bloco de notas padrão do Windows)

Método 1: Criar novo recurso de tela de carregamento

Etapa 1: Criar estrutura de recursos

tela de carregamento/ ├── fxmanifest.lua ├── index.html └── style.css

Etapa 2: Configurar fxmanifest.lua

fx_version 'cerulean' jogo 'gta5' autor 'YourName' descrição 'Tela de carregamento personalizada - Ponte desabilitada' versão '1.0.0' loadscreen 'index.html' loadscreen_cursor 'yes' arquivos { 'index.html', 'style.css' }

Etapa 3: Criar index.html

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div id="loading-container">
        <h1>Nome do servidor</h1>
        <div class="progress-bar">
            <div class="progress-fill"></div>
        </div>
    </div>
    
    <script>
        // Disable bridge overlay
        window.addEventListener('DOMContentLoaded', () => {
            const bridge = document.querySelector('.bridge-overlay');
            if (bridge) bridge.remove();
        });
        
        // Handle loading progress
        window.addEventListener('message', (e) => {
            if (e.data.eventName === 'loadProgress') {
                const fill = document.querySelector('.progress-fill');
                fill.style.width = e.data.loadFraction * 100 + '%';
            }
        });
    </script>
</body>
</html>

Etapa 4: adicionar ao server.cfg

garantir tela de carregamento

Método 2: Modificar a tela de carregamento existente

Etapa 1: localizar o recurso da tela de carregamento atual Verificar servidor.cfg para linhas que começam com garantir ou começar contendo “carregamento” ou “tela de carregamento”

Etapa 2: Adicionar código de remoção de ponte Inserir em arquivo HTML existente antes de fechar </body> marcação:

<script>
    // Remove bridge on load
    document.addEventListener('DOMContentLoaded', function() {
        const bridgeElements = document.querySelectorAll(
            '.bridge-overlay, #bridge, [class*="bridge"]'
        );
        bridgeElements.forEach(el => el.style.display = 'none');
    });
    
    // Backup removal for dynamically loaded elements
    const observer = new MutationObserver((mutations) => {
        mutations.forEach((mutation) => {
            mutation.addedNodes.forEach((node) => {
                if (node.nodeType === 1 && 
                    (node.classList?.contains('bridge-overlay') || 
                     node.id === 'bridge')) {
                    node.remove();
                }
            });
        });
    });
    
    observer.observe(document.body, {
        childList: true,
        subtree: true
    });
</script>

Método de substituição CSS

Adicione ao arquivo CSS da sua tela de carregamento:

.bridge-overlay, #bridge, [class*="bridge-"] { display: none !important; visibility: hidden !important; opacity: 0 !important; }

Solução de problemas

Ponte ainda visível:

Limpar cache do servidor: Excluir esconderijo/ pasta
Verifique a ordem de carregamento dos recursos em servidor.cfg
Verifique o console do navegador (F12) para erros de JavaScript

Tela de carregamento não aparece:

Confirmar tela de carregamento diretiva em fxmanifest.lua
Verifique se os caminhos dos arquivos correspondem exatamente (diferencia maiúsculas de minúsculas)
Verifique se há erros de recursos no console do servidor

Notas Técnicas

As telas de carregamento do FiveM são executadas no CEF (Chromium Embedded Framework)
Elemento de ponte normalmente injetado por mecanismos de carregamento padrão
MutationObserver garante a remoção de elementos adicionados dinamicamente

Incertezas

Os nomes exatos das classes dos elementos da ponte podem variar entre as versões do FiveM
Algumas estruturas personalizadas podem usar diferentes implementações de sobreposição

Resumo: Remova a sobreposição de ponte do FiveM criando um recurso de tela de carregamento personalizado com JavaScript que segmenta e remove elementos de ponte no carregamento da página.

Como criar uma tela de carregamento personalizada