YUI SimpleEditor non è il layout giusto

StackOverflow https://stackoverflow.com/questions/1618188

Domanda

Ho scaricato la libreria YUI per il simpatico SimpleEditor. Quando installato e creato un semplice test. Non verrà visualizzato correttamente.

ecco come dovrebbe apparire. http://developer.yahoo.com/yui/examples/editor/simple_editor. html

e questo è come appare con il mio esempio: http://ms.robertcabri.nl/testing.php

Ecco il codice della mia pagina di test: 

<html>

    <head>
        <title>Test</title>
        <link rel="stylesheet" type="text/css" href="http://ms.robertcabri.nl/js/yui/assets/skins/sam/skin.css" />
        <link rel="stylesheet" type="text/css" href="http://ms.robertcabri.nl/js/yui/editor/assets/skins/sam/simpleeditor.css" />
        <link rel="stylesheet" type="text/css" href="http://ms.robertcabri.nl/js/yui/button/assets/skins/sam/button.css" />
        <script type="text/javascript" src="http://ms.robertcabri.nl/js/yui/yahoo-dom-event/yahoo-dom-event.js"></script>

        <script type="text/javascript" src="http://ms.robertcabri.nl/js/yui/element/element-min.js"></script>
        <script type="text/javascript" src="http://ms.robertcabri.nl/js/yui/container/container_core-min.js"></script>
        <script type="text/javascript" src="http://ms.robertcabri.nl/js/yui/editor/simpleeditor-min.js"></script>
        <script type="text/javascript">
            window.onload = function () {

                var Dom = YAHOO.util.Dom, Event = YAHOO.util.Event;

                var editor = new  YAHOO.widget.SimpleEditor('blaat', {
                    dompath: true,
                    handleSubmit: false
                });

                editor.render();

            };
        </script>

    </head>
    <body>

        <form action="#" method="post" id="test">
            <fieldset>
                <legend>test</legend>
                <textarea name="blaat" id="blaat" cols="30" rows="5"></textarea>
            </fieldset>
        </form>
    </body>
</html>
È stato utile?

Soluzione

Ho trovato la risposta da solo.

La documentazione YUI SimpleEditor è davvero pessima. Lo stile principale deve essere impostato per questo elemento.

nel mio esempio ho impostato un wrapper attorno alla textarea e poi lo stile riprende. 

<div class="yui-skin-sam">
  <textarea></textarea>
</div>

Puoi anche posizionare questa classe su un elemento del modulo o sul corpo. Deve essere un genitore del nodo textarea che si desidera sostituire con il Simpleeditor

Altri suggerimenti

Devi inserire "yui-skin-sam" classe sul tag body, per prima cosa.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top