Vraag & Antwoord

Webdesign (HTML, CSS, Flash)

FORM zonder border mogelijk?

Anoniem
wtulp
9 antwoorden
  • Hallo,

    Ik heb een leuke countdown kalender gevonden welke ik op mijn site wil zetten. Deze counter maakt onder andere gebruik van een FORM om de tekst op de website te zetten.

    De counter doet het goed (staat nog niet online) maar om de tekst staat een randje (border) welke ik er eigenlijk niet omheen wil hebben.
    Ik wil de counter namelijk in een eigen tekst opnemen.

    Is er een manier om de border in een FORM uit te schakelen?
  • Zover ik weet kan een form geen border hebben maar het attribuut dat daarvoor is aangewezen, meestal de input. Daarvoor kan je dit stukje CSS gebruiken.

    [code:1:f6bed9f5f2]
    .input{
    border: 0px;
    }
    [/code:1:f6bed9f5f2]
  • Bedankt,

    Dat was het. Hartstikke mooi.
  • Hallo,

    Het is nog niet helemaal naar mijn zin.
    Aan het eind van de tekst staat nu elke keer een wisselende hoeveelheid spaties waardoor de tekst niet lekker loopt.

    Hieronder heb ik het deel van de javascript afgebeeld welke de tekst in het scherm zet:

    </SCRIPT>
    <FORM name=clock><INPUT name=face size=41></FORM>
    <SCRIPT language=JavaScript>

    <!–
    //document.write('<FORM NAME="clock"><INPUT TYPE="text" SIZE="41" NAME="face"></FORM>');
    startclock()
    // –>

    </SCRIPT>

    Ik zou dus graag willen dat ik de tekst van de javascript in een eigen tekst kan opnemen zonder overbodige spaties.
    Het liefst zou ik ook de "form" er compleet uit willen hebben.

    Wie kan mij verder helpen?
  • Met "wisselend aantal spaties" bedoel je denk ik het verschil tussen de breedte van de input en de breedte van de tekst die erin staat? Dat "1:15:00" smaller is dan "12:15:00". Daar kun je alleen omheen werken als je je clockscript aanpast en niet meer naar een form-input laat verwijzen, maar naar een span.

    Je hebt nu in het clock-script een regel die er ongeveer zo uit ziet:
    document.clock.face.value = varTime;
    Die verwijst naar je form-input en zet daar de tijd in. Je kan je form vervangen door:
    <span id=face></span>
    En dan het script aanpassen naar:
    var s=document.getElementById? document.getElementById("face"):face
    s.innerHTML = varTime;

    De span kun je op iedere plek in het document zetten, dus ook zonder form-tags te gebruiken.
  • Hallo Paulus,

    Bedankt voor je reactie.
    Ik heb de javascript als volgt aangepast:
    (bij mij is de volgende regel gebruikt: "document.clock.face.value = timeRemain;" welke ik zo overgenomen heb ik jou code)

    <span id=face></span>

    <SCRIPT language=JavaScript>
    <!–
    //var s=document.getElementById? document.getElementById("face"):face
    s.innerHTML = timeRemain;
    // –>
    </SCRIPT>

    Ik krijg alleen de datum en tijd-regel nog niet in beeld.
    Zal wel een fout van mij wezen.
    Misschien wil je me nog een stukje verder helpen?
  • Je zit ook helemaal op de verkeerde plek. Je moet in het andere script zijn, die waarin de functie startclock() is gedefinieerd en dus begint met:
    function startclock() {
    Daarin moet je zoeken naar een regel (instructie) die begint met
    document.clock.face.value = ……
    en die moet je vervangen door
    var s=document.getElementById? document.getElementById("face"):face
    s.innerHTML = ……
    Met in het vervangen gedeelte op de puntjes dat wat daar in eerste instantie stond.

    In je pagina zelf hoef je alleen dit te hebben:
    [code:1:b24d0f641a]
    <span id=face></span>
    <SCRIPT language=JavaScript>
    <!–
    startclock()
    // –>
    </SCRIPT>
    [/code:1:b24d0f641a]
    En die <span> kun je dan midden in een zin gebruiken. Het script om de klok te starten kun je ergens anders in de body plaatsen.
  • Hallo Paulus,

    Hartelijk dank voor je zeer snelle antwoord.
    Ik krijg het toch nog niet helemaal voor elkaar.
    Ik heb hieronder het volledige script afgbeeld, met de voorgestelde wijzigingen van jou, waarbij ik in beeld zou willen hebben hoe lang het nog duurt voordat het 25 oktober 2005 is (als voorbeeld)


    <html>

    <head>
    <!–
    This file retrieved from the JS-Examples archives
    http://www.js-x.com
    1000s of free ready to use scripts, tutorials, forums.
    Author: Andrew Turi - 0
    –>
    </head>

    <body>

    <SCRIPT language=JavaScript>

    <!– Activate Cloaking

    var timerID;
    var timerRunning = false;
    var today = new Date();
    var count = new Date();
    var secPerDay = 0;
    var minPerDay = 0;
    var hourPerDay = 0;
    var secsLeft = 0;
    var secsRound = 0;
    var secsRemain = 0;
    var minLeft = 0;
    var minRound = 0;
    var dayRemain = 0;
    var minRemain = 0;
    var Expire = 0;
    var timeRemain = 0;
    var timeUp = "Type Anything You Want" // enter text to be displayed when countdown is finished
    var time = "0 days, 0 hours, 0 minutes, 0 seconds" //do not modify this text

    function stopclock (){
    if(timerRunning)
    clearTimeout(timerID);
    timerRunning = false;
    }

    function startclock () {
    stopclock();
    showtime();
    }


    function showtime () {
    today = new Date();
    count = new Date("October 25, 2005 12:00"); // enter date to count down to (use the same format)
    count.setYear(today.getYear());
    secsPerDay = 1000 ;
    minPerDay = 60 * 1000 ;
    hoursPerDay = 60 * 60 * 1000;
    PerDay = 24 * 60 * 60 * 1000;
    Expire = (count.getTime() - today.getTime())

    /*Seconds*/

    secsLeft = (count.getTime() - today.getTime()) / minPerDay;

    secsRound = Math.round(secsLeft);

    secsRemain = secsLeft - secsRound;

    secsRemain = (secsRemain < 0) ? secsRemain = 60 - ((secsRound - secsLeft)
    * 60) : secsRemain = (secsLeft - secsRound) * 60;

    secsRemain = Math.round(secsRemain);


    /*Minutes*/

    minLeft = ((count.getTime() - today.getTime()) / hoursPerDay);

    minRound = Math.round(minLeft);

    minRemain = minLeft - minRound;

    minRemain = (minRemain < 0) ? minRemain = 60 - ((minRound - minLeft) *
    60) : minRemain = ((minLeft - minRound) * 60);

    minRemain = Math.round(minRemain - 0.495);


    /*Hours*/

    hoursLeft = ((count.getTime() - today.getTime()) / PerDay);

    hoursRound = Math.round(hoursLeft);

    hoursRemain = hoursLeft - hoursRound;

    hoursRemain = (hoursRemain < 0) ? hoursRemain = 24 - ((hoursRound -
    hoursLeft) * 24) : hoursRemain = ((hoursLeft - hoursRound) * 24);

    hoursRemain = Math.round(hoursRemain - 0.5);

    /*Days*/

    daysLeft = ((count.getTime() - today.getTime()) / PerDay);

    daysLeft = (daysLeft);

    daysRound = Math.round(daysLeft);

    daysRemain = daysRound;


    /*Fixes*/

    if (daysRemain == 1) daysRemain = daysRemain + " dag, ";
    else daysRemain = daysRemain + " dagen, ";

    if (hoursRemain == 1) hoursRemain = hoursRemain + " uur, ";
    else hoursRemain = hoursRemain + " uur, ";

    if (minRemain == 1) minRemain = minRemain + " minuut, ";
    else minRemain = minRemain + " minuten, ";

    if (secsRemain == 1) secsRemain = secsRemain + " seconde";
    else secsRemain = secsRemain + " seconden";


    /*Time*/

    timeRemain = daysRemain + hoursRemain + minRemain +
    secsRemain;

    window.status = "";
    var s=document.getElementById? document.getElementById("face"):face
    s.innerHTML = timeRemain;
    timerID = setTimeout("showtime()",1000);
    timerRunning = true;

    if (Expire <= 0){
    document.clock.face.value = time; // choose either "time" or "timeUp" (without quotes)
    stopclock()
    }

    }
    // De-activate Cloaking –>
    // –>

    <SCRIPT language=JavaScript>
    <!–
    startclock()
    // –>
    </SCRIPT>

    Het duurt nog <span id=face></span> voordat het 25 oktober 2005 is.

    </body>
    </html>


    Ik hoop dat ik je geduld niet al te veel op de proef stel.
    In ieder geval bvij voorbaat dank.
  • Er ontbreekt een </script>-tag:
    [code:1:df4a4479a8]
    De-activate Cloaking –>
    // –>

    <SCRIPT language=JavaScript>
    [/code:1:df4a4479a8]
    moet zijn
    [code:1:df4a4479a8]
    De-activate Cloaking –>
    // –>
    </SCRIPT>

    <SCRIPT language=JavaScript>
    [/code:1:df4a4479a8]
    En je moet de span eerst in het document laden en pas daarna het script, dus de regel
    Het duurt nog <span id=face></span> voordat het 25 oktober 2005 is.
    meteen na de body-tag, en de scripts onderin de body.
    En ik zie ook dat je na de span het beste een &nbsp; kan zetten, aangezien de span leeg is en er al een spatie voor staat, waardoor bij het laden van de pagina de tweede spatie wordt weggelaten. Probeer eerst maar eens zonder, dan zie je wel wat ik bedoel.

    Het duurt nog <span id=face1></span>&nbsp;voordat het 25 oktober 2005 is.

Beantwoord deze vraag

Dit is een gearchiveerde pagina. Antwoorden is niet meer mogelijk.