Gist containing the HTML, Javascript and CSS to provide an additional amount field on a storefront page.

additional_amount_css.html

<!-- Style changes to make the totals look better. 
     See https://salsasupport.zendesk.com/entries/66755514. -->
<style type="text/css">
    /* Make the subtotals and totals right-justified.
       Put this into the Pre-Submit Footer, too. */
    #sub,
    #subvoluntary,
    #shipping,
    #amountDisplay
    {
        padding-right: 15px;
        text-align: right;
    }
</style>

additional_amount_footer_contents.html

<!-- Put this into the storefront Pre-Submit Footer. The <input> field is *required* and should not 
     be disturbed.  The <label> field is highly recommended.  Everything is is completely configurable.
     See https://salsasupport.zendesk.com/entries/66755514
-->
<div style="background-color: #F5F5F5; padding: 10px; margin: 10px;">
    <p style="font-size: medium; font-family: Times New Roman;">By making an additional tax-deductible donation here,
    you can help us to do more!</p>
    <p style="font-size: medium; font-family: Times New Roman;font-size: 11pt;float:left;">Can we count on you?</label></p>
    <div style="float:left;">
        <!-- This input tag is required.  Everything else is available for customizing.-->
        <input type="text" class="voluntary_amount" value="" id="voluntary" name="voluntary" style="text-align: right;" />
        <br />
        <span class="digits-only">No dollar signs or commas, please.</span>
    </div>
</div>
<div class="clear"></div>

additional_amount_script.html

<!-- Script that does the work.  Add this to the template that the storefront is using.
Add this script just above either the </head> or </body> tag, depending
on where there's room and what the client likes.
See https://salsasupport.zendesk.com/entries/66755514 -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        // This script is restricted to storefront checkout pages.
        if (RegExp('checkOut.jsp\\?storefront_KEY=').test(window.location.href)) {
            // Constants.
            var NORTH_AMERICA = 0.00;
            var VOLUNTARY_SUBTOTAL_PROMPT = "Your additional contribution";
            // Return the voluntary amount or a zero.
            //
            // @return  [Number]  voluntary amount, if defined, or a zero
            //
            var getVoluntaryAmount = function() {
                var e = $('#voluntary');
                if (e.length > 0) {
                    var t = parseFloat(e.val());
                    if (isNaN(t)) {
                        console.log("Not a valid floating point number '" + e.val() + "'.");
                        return 0.0;
                    } else {
                        if (t > 0.0) {
                          return t;
                        }
                    }
                }
                var e = $('#subvoluntary');
                if (e.length > 0) {
                    var t = parseFloat(e.val());
                    if (isNaN(t)) {
                        console.log("Not a valid floating point number '" + e.val() + "'.");
                        return 0.0;
                    } else {
                        return t;
                    }
                }
            }
            // Workaround for problem where changing the country in a storefront
            // does not cause the current states to appear.
            //
            // @param   [String]  country   the selected country
            // @param   [String]  fieldName   the field name for the states to update
            //
            var updateStates = function(country, fieldName) {
                country = (country === null || country.length == 0) ? 'US' : country;
                var url = "/o/6694/p/salsa/common/international/public/country/eng/countryData.sjs";
                url = url + "?country=" + country + "&jsoncallback=?";
                $.getJSON(url, function(data) {
                    var stateField = $('*[name="' + fieldName + '"]');
                    stateField.find('option').remove();
                    stateField.append("<option value>Select a state or province</option>");
                    for (var key in data.states) {
                        var state = data.states[key];
                        // Numeric codes mean that the state name should be used, and not the state code.
                        var stateCode = /\d+/.test(state.code) ? state.name : state.code;
                        stateField.append("<option value=" + state.name + ">" + stateCode + "</option>");
                    }
                });
            }
            // Update the total by getting the page shipping charge and
            // formatting the subtotal, shipping and total fields.
            var updateTotal = function() {
                var sub = parseFloat($('*[name=sub]').val());
                var shipping = parseFloat($('[name=shipping]').val());
                var voluntary = getVoluntaryAmount();
                shipping = shipping !== null ? shipping : 0;
                $('*[name=shipping]').val(shipping.toFixed(2));
                $('[name=subvoluntary]').val(voluntary.toFixed(2));
                var amountDisplay = sub + shipping + voluntary;
                $('*[name=amountDisplay]').val(amountDisplay.toFixed(2));
                // Needs to be Just A Number, so don't even think about making
                // this one fancy-looking.
                $('*[name=amount]').val(amountDisplay.toFixed(2));
            }
            // Set listeners to change the page shipping charge and the states
            // when either the billing or the shipping country changes.
            $.each(['Country', 'country'], function(index, countryField) {
                field = $('*[name="' + countryField + '"]');
                field.change(function() {
                    if (countryField === 'Country' && $('#mailing').is(':hidden')) {
                        $('*[name=country]').val('');
                    }
                    updateTotal();
                    var stateField = countryField === 'Country' ? 'State' : 'region';
                    updateStates($(this).val(), stateField);
                });
            });
            // Add the voluntary subtotal field.  Note that the prompt is a
            // constant, and the client can customize it at will.
            if ($('#subvoluntary').length == 0) {
                $('td:contains("Shipping/Handling")').filter(':last').parent().before(''
                    + '<tr>' + '<td colspan="3" align="right">'
                    + VOLUNTARY_SUBTOTAL_PROMPT + '</td>' + '<td align="right">'
                    + '$<input name="subvoluntary" id="subvoluntary" value="" size="7" align="right">'
                    + '</td>' + '<td> </td>' + '<td> </td>' + '</tr>');
            }
            // Set a listener to update the total when the voluntary subtotal
            // amount changes.
            $('#subvoluntary').blur(function() {
                $(this).val($(this).val().replace('$', '').replace(',', '').trim());
                updateTotal();
            });
            // Set a listener to update the total when the voluntary amount changes.
            $('#voluntary').blur(function() {
                $(this).val($(this).val().replace('$', '').replace(',', '').trim());
                updateTotal();
            });
        }
    });
</script>
<!-- You should also clean up the invoice on the checkout page. See
https://salsasupport.zendesk.com/entries/55618650, an put the script
into the Footer. -->