Scrolling Entries

Oct 06, 2004 08:32

To make your entries scroll, review the print_entry function to find where (and understand how?) the entries are printed and then add a little CSS to the stylesheet.



function Page::print_entry (Entry e) {

print """""";
var string time = $e.time->time_format();
var string date = $e.time->date_format();
var string security;
if ($e.security != "") {
$security = """
""";
}

var UserLite name;
var string pname;

var bool show_name = ($.view == "friends" or $e.poster.username != $.journal.username or $.view == "entry") ? true : false;
var bool show_pic = (defined $e.userpic and ($.view == "friends" or $*show_entry_userpic or $e.poster.username != $e.journal.username or $.view == "entry")) ? true : false;

"""

""";
if($show_pic) {
"""




""";
}

if($show_name) {
$this->lay_make_username($e);
}
"""

$security $date $time

""";

$e.comments->print();

foreach var string key (["edit_entry","mem_add","tell_friend"]) {
var Link link = $e->get_link($key);
if ($link) {
"""   $link.caption   """;
}
}
"""   $*text_permalink  

$e.subject

$e.text

""";

$e->print_metadata();

"""

back to top

""";
}

Each entry is wrapped in a DIV with a class of 'entry' and the content of the entry is wrapped in a DIV with the class of 'entrytext.' Ctrl-F for ".entrytext" to find the class in the stylesheet. Right now all it has is a margin-bottom definition.

.entrytext { margin-bottom: 10px; }

Add a height and relative positioning to the class and set overflow to auto.

.entrytext { margin-bottom: 10px;
height: 200px;
overflow: auto;
position: relative; }

This same concept can be used for controlling the layout when someone posts a large image or an unbreaking string of text. In that case, just add a width to the class and left-right scrollbars will be added to the entry when needed.

Example

Edited to apply this to the entrytext class and not the entry class.
Previous post Next post
Up