hallo zusammen,
ich hoffe, jemand kann mir bei meinem vorhaben helfen.
ich versuche die oxarticlebox.js so umzubauen, dass es das gleiche macht wie bei:
www.impressionen.ch
siehe unter "Kunden kauften auch" Marke und Preis wird angezeigt, während man mit der Maus über das Produkt fährt.
Code: oxarticlebox.js
Vielen Dank.
Avni
ich hoffe, jemand kann mir bei meinem vorhaben helfen.
ich versuche die oxarticlebox.js so umzubauen, dass es das gleiche macht wie bei:
www.impressionen.ch
siehe unter "Kunden kauften auch" Marke und Preis wird angezeigt, während man mit der Maus über das Produkt fährt.
Code: oxarticlebox.js
HTML Code:
( function( $ ) {
oxArticleBox = {
_create: function(){
var oSelf = this,
oElement = oSelf.element,
sTitlePattern = /^(.+) \([0-9]+\)$/,
sEndPattern = / \([0-9]+\)$/;
//hide all
$('.articleTitle', oElement).hide();
//open first
//$('.articleTitle:last', oElement).hide();
//$('.articleTitle:last', oElement).addClass('showTitle');
$('.articleImage', oElement).mouseover(function() {
//if not opened
if ($(this).next().is(':hidden') == true) {
//closing opened
$('.articleImage', oElement).removeClass('imageOn');
$('.showTitle', oElement).slideUp(500);
//opening selected
$(this).addClass('imageOn');
$(this).next().addClass('showTitle')
$(this).next().toggle(600);
}
});
// triming titles to mach container width (if needed)
$( ".box h3 a", oElement ).each(function() {
var iTitleWidthh = $(this).width(),
iContWidt = $(this).parent().width(),
sTitleText = $.trim($(this).text());
// if title is longer than its container
if (iTitleWidth > iContWidth) {
// checking if title has numbers at the end
var sTitleEnd = $.trim(sEndPattern.exec(sTitleText));
// seperating the title from the numbers
if (sTitleEnd) {
sTitleEnd = ' ' + sTitleEnd;
sTitleText = sTitlePattern.exec(sTitleText).pop();
}
// getting the length of the title
var iTitleLength = sTitleText.length;
while (iTitleWidth > iContWidth)
{
iTitleLength--;
$(this).html(sTitleText.substr(0, iTitleLength)+'…' + sTitleEnd);
var iTitleWidth = $(this).width();
}
$(this).attr('title',sTitleText);
}
});
}
}
$.widget( "ui.oxArticleBox", oxArticleBox );
} )( jQuery );
Vielen Dank.
Avni