1

Pessoal tenho um projeto c# MVC5 e meu cenário é o seguinte: Tenho que abrir em uma url amigável uma serie grande de páginas (com conteúdo de mídia) feitas por terceiros. Uma de cada vez claro (de acordo com o parâmetro recebido) Criei então essa URL amigável e na minha View carrego essa página em um iframe:

<iframe id='TourVirtual' runat='server' frameborder='0' allowFullScreen=allowFullScreen src="@ViewBag.Link" gesture="media"></iframe>

Funciona legal no desktop, mas a responsividade da página que fica dentro do iframe não funciona de acordo, ela deveria reajustar o tamanho de botões e imagens de maneira mais adequada a tela pequena. Como sou uma ameba em relação a css... queria saber:

Como preparar a página filha para ser carregada em um iframe de forma que ela mantenha a responsividade? Ou talvez essa "preparação" não seja necessário se eu carregar a página de outra maneira. Aceito sugestões.

UPLOAD----------------------------------------

Eu cheguei a tentar carregar a página pelo back-end (razor). com este código:

@{
    string URL = ViewBag.Link;
    //bool HomeH1 = Request.Url.Segments.Length == 1;
    WebClient client = new WebClient();
    client.Encoding = System.Text.Encoding.UTF8;
    var header = client.DownloadString(URL);
}
@Html.Raw(header)

Mas não tive sucesso pois o caminho para os css e js da propia página é passado de forma indireta /arquivoccdoscara.css aí ele pega a url do meu site e ferra tudo. E não posso alterar esse caminhos, porque como disse esse materia é produzido por terceiros e já existem dezenas (talvez centenas prontos) então mesmo que me desse autorização para alterar as rotas dos js/css deles não seria viável.

UPLOAD----------------------------------------

O problema que estou tento é melhor exemplificado nas imagens a seguir:

Aqui como deveria carregar (quando acesso diretamente) screenshot.net/pt/79q54hd

Aqui é como está sendo carregada (quando uso o iframe) screenshot.net/pt/8gowrbw

Reparem que ao invés de seguir a formatação própria de dispositivos moveis, o conteúdo apenas encolhe de tamanho.

11
  • Primeiro, porque há necessidade de carregar dentro de uma iframe? os dados estão vindo do mesmo site ou de outro ? caso seja do mesmo, pode carregar via ajax (jquery). Creio que o problema da responsavidade não esteja em ser carregado dentro de uma iframe, mas sim nos @media do arquivo css, que talvez não estejam setados para determinado portview 27/08/2018 às 16:24
  • @MarcosBrinner iframe, foi apenas a única maneira que encontrei para o link não ficar /uploadfiles/agenciax/569896. Essas páginas são compilados de fotos que permitem navegação como no google street view. Temos uma para cada imovel. Ao clicar no link, abro em uma nova guia com uma url amigavél meusite/tourvirtual/nomedoimovel e jogo a página no iframe que ocupa 100% do espaço de tela no navegador. Eu cheguei até a tentar outra coisa via back-end... vou adicionar agora ao final dessa pergunta.
    – AlamO
    27/08/2018 às 16:32
  • 1
    de uma olha em stackoverflow.com/questions/4389932/… 28/08/2018 às 13:50
  • 1
  • 1
    @MarcosBrinner era isso mesmo. Obrigado aos que colaboraram e tiveram paciência.
    – AlamO
    28/08/2018 às 18:08

1 Resposta 1

1

A solução foi adicionar um viewport na página que ** contém ** o iframe. A que está contida já tinha.

<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1.0, viewport-fit=cover" /> 

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .