none
Redimensionar objeto RRS feed

  • Pergunta

  • Senhores, 

    Alguém poderia me ajudar.

    Estou tentando efetuar o Resize de um objeto mas não estou tendo sucesso, esperava que ao clicar no botão as dimensões do objeto "panel2" fossem alteradas, mas isto não ocorre.

     Coloco em anexo o código fonte.

    Grato pela atensão de todos.

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Teste5._Default" %>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
        
            <asp:ScriptManager ID="ScriptManager1" runat="server">
            </asp:ScriptManager>
        
        </div>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <asp:Panel ID="Panel1" runat="server" 
                    
                    style="z-index: 1; left: 10px; top: 48px; ; height: 190px; width: 185px" 
                    BorderStyle="Inset">
                    <asp:Button ID="btn300x300" runat="server" onclick="btn300x300_Click" 
                        style="z-index: 1; left: 41px; top: 48px; ; width: 100px;" 
                        Text="300 x 300" />
                    <asp:Button ID="btn600x600" runat="server" onclick="btn600x600_Click" 
                        style="z-index: 1; left: 41px; top: 106px; ; width: 100px;" 
                        Text="600 x 600" />
                </asp:Panel>
                <asp:Panel ID="Panel2" runat="server" 
                    
                    style="z-index: 1; left: 220px; top: 48px; ; height: 190px; width: 185px" 
                    BorderStyle="Inset">
                </asp:Panel>
            </ContentTemplate>
        </asp:UpdatePanel>
        </form>
    </body>
    </html>
    

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    
    namespace Teste5
    {
        public partial class _Default : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
    
            }
    
            protected void btn300x300_Click(object sender, EventArgs e)
            {
                Panel2.Height = 300;
                Panel2.Width = 300;
            }
    
            protected void btn600x600_Click(object sender, EventArgs e)
            {
                Panel2.Height = 600;
                Panel2.Width = 600;
            }
        }
    }
    


    sexta-feira, 4 de outubro de 2013 19:03

Respostas

  • Faça com JQuery assim :

    <script type="text/javascript">
            $(document).ready(function(){
           $("#btn600x400").click(function () {
                $("#Panel2").resizable();
            }       
            });
    </script> 
    
     <style type="text/css">
            body, html
            {
                margin: 0px;
                border: 0px;
                padding: 0px;
    
            }
    
    
            .resize
            {
                ;
                left: 0px;
                height: 100%;
                background: blue;
                cursor:pointer;         
                max-width: 300px;
                padding: 20px;
            }
    </style>

    Fica melhor assim.

    Se for útil marque...


    • Editado Daniel Brito br sexta-feira, 4 de outubro de 2013 19:42 Nome obj
    • Marcado como Resposta nksasso sexta-feira, 4 de outubro de 2013 20:49
    sexta-feira, 4 de outubro de 2013 19:41

Todas as Respostas

  • Faça com JQuery assim :

    <script type="text/javascript">
            $(document).ready(function(){
           $("#btn600x400").click(function () {
                $("#Panel2").resizable();
            }       
            });
    </script> 
    
     <style type="text/css">
            body, html
            {
                margin: 0px;
                border: 0px;
                padding: 0px;
    
            }
    
    
            .resize
            {
                ;
                left: 0px;
                height: 100%;
                background: blue;
                cursor:pointer;         
                max-width: 300px;
                padding: 20px;
            }
    </style>

    Fica melhor assim.

    Se for útil marque...


    • Editado Daniel Brito br sexta-feira, 4 de outubro de 2013 19:42 Nome obj
    • Marcado como Resposta nksasso sexta-feira, 4 de outubro de 2013 20:49
    sexta-feira, 4 de outubro de 2013 19:41
  • Daniel,

    Obrigado pelo retorno, mas não funcionou, ou eu que não consegui implementar a sua ideia corretamente.

    Grato,

    sexta-feira, 4 de outubro de 2013 20:44
  • Daniel,

    Mais uma vez obrigado.

    Como era uma das minhas suspeitas, na realidade eu havia implementado errado.

    Sua ideia funcionou.

    Entretanto havia um detalhe que não informei no relato, é que os valores são decididos durante a execução da aplicação, por exemplo, o Width pode ser 300 agora, numa próxima execução pode ser 350, e assim por diante.

    Teria alguma ideia de como fazer o valor ser alterado durante a execução?

    Grato,

    sexta-feira, 4 de outubro de 2013 20:55