Zmiana rozmiaru formularza internetowego

Ostatnia aktualizacja 20 lip 2023

Zmiana wysokości i szerokości formularza internetowego

Wysokość i szerokość formularza internetowego można zmienić, edytując kod osadzenia formularza internetowego na rozmiar statyczny na podstawie pikseli lub rozmiar względny na podstawie wartości procentowej wielkości ekranu.

Spostrzeżenie

Ta procedura dotyczy tylko kodu osadzenia skryptów i ramek iframe. Nie można zmieniać rozmiaru formularzy internetowych adresów URL.

Domyślnie wysokość i szerokość formularza internetowego są skalowane wraz z rozmiarem przeglądarki. Ta właściwość dynamiczna powoduje, że formularz internetowy może być wyświetlany w większości rozdzielczości ekranowych.

Aby dostosować wymiary formularza internetowego, należy najpierw pobrać kod HTML lub skryptu z formularza internetowego.

Edycja rozmiaru ramki formularza internetowego zależy od używanego kodu:

Kod HTML (ramka iframe)

Kod HTML zawiera elementy sterujące w ciągu skopiowanym z formularza internetowego.

Poniżej znajduje się przykładowy ciąg kodu ramki iframe:

<iframe src=&quot;https://secure.na1.adobesign.com/public/esignWidget?wid=CBFCIBAA3AAABLblqZhDGvdwEWK6RveVqcwpzncUOYmtOI*&hosted=false&quot; width=&quot;100%&quot; height=&quot;100%&quot; frameborder=&quot;0&quot; style=&quot;border: 0; overflow: hidden; min-height: 500px; min-width: 600px;&quot;></iframe>

Na końcu ciągu kodu znajdują się parametry width="100%" i height="100%". Dopasowanie tych parametrów powoduje dostosowanie rozmiaru ramki formularza internetowego. Mogą być używane wartości procentowe lub stały rozmiar w pikselach (pamiętaj, aby usunąć symbol wartości procentowej).

Edytuj ciąg kodu w dowolnym edytorze tekstu, a następnie skopiuj i wklej edytowany kod na stronę internetową.

Spostrzeżenie

Argument ?wid= wskazuje unikatowy identyfikator formularza internetowego i jako taki będzie różny dla każdego utworzonego formularza internetowego.

Kod (Java)Script (skrypt)

Opcja JavaScript jest nieco bardziej złożona, ponieważ parametry nie są już zawarte w ciągu, ale idea jest taka sama.

Poniżej znajduje się przykład skryptu tego samego formularza internetowego. 

<script type='text/javascript' language='JavaScript' src='https://secure.na1.adobesign.com/public/embeddedWidget?wid=CBFCIBAA3AAABLblqZhDGvdwEWK6RveVqcwpzncUOYmtOI*'>
</script>

Aby dostosować rozmiar klatki za pomocą skryptu, należy otoczyć elementy <script></script> elementem <div> zawierającym właściwości ramki. Wymusza to istnienie <script> w obrębie kontenera <div> i tym samym podlega ograniczeniom <div>.

Przykładowy element <div> o szerokości 600 pikseli, wysokości 500 pikseli i pełnej czarnej ramce o szerokości 1 piksela:

<div style=&quot;height:500px; width:600px; border:1px solid black;&quot;> 
</div>

Skrypt musi być zawarty w elemencie <div>, w wyniku czego kompletny blok kodu wygląda następująco:

<html>

    <div style=&quot;height:500px; widget:600px; border: 1px solid black;&quot;>

        <script type='text/javascript' language='JavaScript' src='https://secure.na1.adobesign.com/public/embeddedWidget?wid=CBFCIBAA3AAABLblqZhDGvdwEWK6RveVqcwpzncUOYmtOI*'>

        </script>

    </div>

</html>

Wynikowy formularz internetowy jest wyświetlany z podanymi wymiarami.

Inne przykłady konfiguracji skryptu

Pełny ekran 1

<body style=&quot;margin: 0; padding: 0;&quot;>

        <script type='text/javascript' language='JavaScript' src='https://secure.na1.adobesign.com/public/embeddedWidget?wid=CBFCIBAA3AAABLblqZhDGvdwEWK6RveVqcwpzncUOYmtOI*'>

        </script>

</body>

Pełny ekran 2

<div style=&quot;height:100%; width:100%; border:0px solid black;&quot;>

        <script type='text/javascript' language='JavaScript' src='https://secure.na1.adobesign.com/public/embeddedWidget?wid=CBFCIBAA3AAABLblqZhDGvdwEWK6RveVqcwpzncUOYmtOI*'>

        </script>

</div>