Question

I would like to know whether there are any Drupal (6.x) modules and/or theming tutorials that can implement the effect of hiding and showing certain (clickable) elements of a view listing only when on mouse hover within the item’s div (and not as a tool tip or popup). e.g. in http://rusoom.com/ the Author, Like, Info and Share links of each image (view item) only show on mouse over.

Another example will be the display of Favorite, Retweet and Reply displayed on each tweet on mouse-hover, when logged in to Twitter (http://twitter.com) and viewing any tweet stream.

Any help will be deeply appreciated.

Thanks in advance.

Answer 1

I would use the mouseover function in jQuery and create my custom JavaScript code (in a custom module or in the theme). Here is an example of the code:

file: sites/all/themes/MYTHEME/template.php

<?php
function MYTHEME_preprocess_page(&$variables) {
   drupal_add_js(drupal_get_path('theme', 'MYTHEME') .'/mytheme.js', 'file');
}
?>

file: sites/all/themes/MYTHEME/mytheme.js

$('.box').mouseover(function() {
    $('.hidden').show();
})

HTML (Views generated code)

<div class="box">Mouse over me to see hidden content</div>
<div class="hidden" style="display:none">This is hidden</div>

This is a quick mockup but it should get you in the right direction. If there isn’t a module for this you can consider making one from this code!
Good luck