CMS Made Simple - Official website CMS made Simple Czech Site Zur deutschsprachigen Supportseite CMS Made Simple - Danmark Sitio en Castellano Site francophone Benvenuto su CMSmadesimple CMSMS -  русский CMS Made Simple - slovenská verzia
Facebook

Rejtett szöveg

Ha hosszú a szöveg, vagy van amit nem kell azonnal megmutatni, esetleg csak akkor, ha valakit érdekel?

Akkor van egy egyszerű megoldás a custom dropdown menu-ben (kis sárga pálma):

{startExpandCollapse}ide jön a szöveg{stopExpandCollapse}

(Bátrabbak próbálják lefordítani: legördülő tartalom, kinyit-elrejt stb...)

 

Példa (klikk a linkre):

Rejtett szöveg

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc mauris. Sed a erat ac sem eleifend mattis. Maecenas convallis interdum nisl. Maecenas magna dui, consequat id, hendrerit ut, tempus in, tortor. Mauris ut augue et ante egestas tincidunt. Phasellus lectus. Ut porttitor. Curabitur felis. Duis pellentesque, metus laoreet condimentum suscipit, arcu elit varius nisl, id ultricies lectus mauris a augue. Ut non enim. Sed eleifend ultrices est. Nunc lobortis, tortor vitae facilisis ultricies, nisl ante sollicitudin erat, dapibus consequat sem dolor quis tortor.


Ha az oldalon több ilyen rész van, vagy saját szöveget szeretnénk a linknek, akkor a megoldás:

{startExpandCollapse id='expand1' title='Rejtett szöveg'}{stopExpandCollapse}

 

Itt van egy kis finomítás:

jQuery-vel a lenyílást szebbé lehet tenni.

A sablon <head> részébe be kell illeszteni ezt a kódot (Természetesen [literal][/literal] közé és persze, hogy { } zárójel!):


<script type="text/javascript">
jQuery(document).ready(function() {
jQuery(".shcontent").hide();
jQuery(".shtitle").click(function()
{
jQuery(this).next(".shcontent").slideToggle(500);
});
});
</script>
Ha a JqueryTools nem hívja be a jquery.js-t, akkor még ez is kell:
<script type="text/javascript" src="uploads/scripts/jquery.js"></script>

A path-t értelemszerűen változtani kell a valósnak megfelelően.

Az elrejtendő részt (html szerkesztés nézetben) a megfelelő helyre:

<p class="shtitle"><strong>Mutat/Elrejt</strong></p>
<div class="shcontent">
A kívánt tartalom ide...
</div>

Lehet egy kicsit formázni is css-ben:

.shtitle {
cursor: pointer; / * this is needed to make it look like a link */
font-weight: bold;
}

.shcontent {
background-color: #dddddd;

padding:5px;
}

Az eredmény itt látható:

Mutat/Elrejt

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec fermentum accumsan rhoncus. Donec a nisi elit, eget consectetur libero. Pellentesque lacus neque, blandit ut laoreet et, consectetur ut sem. Nunc sollicitudin dolor placerat mauris auctor a venenatis ligula lobortis. Pellentesque sit amet nisi eu massa scelerisque dignissim eu at augue. Cras porta vehicula dui eget commodo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent congue elit eget velit congue posuere. Curabitur et augue congue metus faucibus sodales. Aliquam a mauris et libero porta porta at eget sapien. Duis vitae dui et felis condimentum pretium nec et lacus. Phasellus tempor libero eget neque fermentum eu posuere odio semper. Mauris nec sapien erat. Vivamus rhoncus, ante a laoreet bibendum, magna tortor suscipit magna, ac mollis elit lectus id felis. Ut dapibus aliquet purus eu viverra. Cras non ligula id urna dignissim rhoncus. Curabitur id orci in neque pretium sodales sit amet ut mi. Nulla facilisi. Duis ultricies tempor massa quis tristique. Integer sollicitudin fermentum tristique.
Előző oldal: Utoljára készült oldalak    Következő oldal: Gallery modul és JQueryTools
( Készült: 2010. 12. 12. 8.27 Módosítva: 2010. 12. 18. 9.05 )