Artigos‎ > ‎ASP.NET (27)‎ > ‎

Usando o IFrame em ASP.NET - 2

Salve, pessoal. 

Para os apaixonados por controles nativos do HTML, que tal utilizar o IFrame como um mini-browser para navegar em páginas externas no escopo da aplicação? Lembro bem que já publicamos um vídeo sobre o assunto e está disponível na seção Videos > ASP.NET.

Pois é, o exemplo é muito simples e não requer muito esforço para conseguir um resultado satisfatório. Veja um screenshot do resultado do artigo.

Para definir o layout da página, precisamos criar uma estrutura usando alguns DIVs pré-configurados em folhas de estilo (CSS). 
Vamos direto ao ponto! 

Código fonte do arquivo styles.css:

html,body{margin:0;padding:0}

body{font: 76% arial,sans-serif;text-align:center}

p{margin:0 10px 10px}

a{padding:5px; text-decoration:none; color:#000000;}

div#header{background-color:#F3F2ED;}

div#header h1{height:80px;line-height:80px;margin:0;padding-left:10px;}

div#container{text-align:left}

div#content p{line-height:1.4}

div#navigation{background:#F6F0E0; height: 508px;}

div#navigation ul{margin:15px 0; padding:0; list-style-type:none;}

div#navigation li{margin-bottom:5px;}

div#extra{background:#CCC8B3;}

div#footer{background:#BFBD93;}

div#footer p{margin:0;padding:5px 10px}

div#container{width:900px;margin:0 auto}

div#content{float:right;width:700px}

div#navigation{float:left;width:200px}

div#extra{clear:both;width:100%}


Código fonte HTML da página Default.aspx:

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>

<title>Free Css Layout</title>

    <link href="css/styles.css" rel="stylesheet" type="text/css" />

<link rel="stylesheet" type="text/css" href="styles.css" />

</head>

<body>

<div id="container">

    <div id="header"><h1>Usando IFrame em ASP.NET</h1></div>

    <div id="wrapper">

        <div id="content">

            <iframe name="" src="<% =sUrl %>" style="height: 504px; width: 692px"></iframe>

        </div>

    </div>

    <div id="navigation">

        <p><strong>Meus Links</strong></p>

        <ul>

            <li><a href="Default.aspx?url=g1">Globo</a></li>

            <li><a href="Default.aspx?url=fsp">Folha de São Paulo</a></li>

            <li><a href="Default.aspx?url=tra">Terra</a></li>

            <li><a href="Default.aspx?url=uol">UOL</a></li>

            <li><a href="Default.aspx?url=inf">Info OnLine</a></li>

        </ul>

    </div>

    <div id="extra">

        <p align="center"><a href="http://sites.google.com/site/programacaoonline">Programação On-Line</a></p>

    </div>

</div>

</body>

</html>


Para concluir, segue o código em linguagem C# para permitir a navegação das páginas externas.

public partial class _Default : System.Web.UI.Page

{

    public string sUrl = "";

    protected void Page_Load(object sender, EventArgs e)

    {

        if (!string.IsNullOrEmpty(Request.QueryString["url"]))

            this.ValidaUrl(Request.QueryString["url"]);

    }

    private void ValidaUrl(string p)

    {

        switch (p)

        {

            case "g1":

                sUrl = "http://www.globo.com";

                break;

            case "fsp":

                sUrl = "http://www.folha.com";

                break;

            case "tra":

                sUrl = "http://www.terra.com";

                break;

            case "uol":

                sUrl = "http://www.uol.com";

                break;

            case "inf":

                sUrl = "http://www.infoexame.com";

                break;

        }

    }

}


Na seção Anexos desta página, encontra-se o código fonte do projeto. 
Até mais! 

by Tecla. 
contato.programacao@gmail.com
Postado as 15h41 em 19/11/2010.
ċ
UsandoIFrame.rar
(4k)
ftecla,
19 de nov de 2010 10:00
Comments