Skip to content
This repository has been archived by the owner on Jun 9, 2023. It is now read-only.

New span added with long description, will be shown on mouseover curr… #34

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 25 additions & 1 deletion pgwslider.css
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
* Released under the GNU GPLv3 license - http://opensource.org/licenses/gpl-3.0
*/
.pgwSlider {
width: 100%;
width: 70%;
color: #fff;
}

Expand Down Expand Up @@ -61,6 +61,30 @@
z-index: 3;
}

.ps-current:hover span.ps-long-description {
opacity: 1;
}

.pgwSlider .ps-long-description {
position: absolute;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.7);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000);
left: 0;
top: 0;
display: inline;
opacity: 0;
z-index: 2;
-webkit-transition: all 300ms ease-out;
-moz-transition: all 300ms ease-out;
transition: all 300ms ease-out;
}

.pgwSlider .ps-long-description p {
padding: 20px;
}

ul.pgwSlider,
.pgwSlider ul {
float: right;
Expand Down
36 changes: 24 additions & 12 deletions pgwslider.js
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@
}

// Get title
var elementSpan = obj.find('span').text();
var elementSpan = obj.find('span.pgwSlideTitle').text();
if ((typeof elementSpan != 'undefined') && (elementSpan != '') && (elementSpan != null)) {
element.title = elementSpan;
} else {
Expand All @@ -103,8 +103,8 @@
}

// Get description
var elementDescription = obj.find('img').attr('data-description');
if ((typeof elementDescription != 'undefined') && (elementDescription != '')) {
var elementDescription = obj.find('span.pgwSlideDescription').text();
if ((typeof elementDescription != 'undefined') && (elementDescription != '') && (elementSpan != null)) {
element.description = elementDescription;
}

Expand Down Expand Up @@ -221,7 +221,7 @@
pgwSlider.plugin.removeClass(pgwSlider.config.mainClassName).addClass('ps-list');
pgwSlider.plugin.wrap('<div class="' + pgwSlider.config.mainClassName + '"></div>');
pgwSlider.plugin = pgwSlider.plugin.parent();
pgwSlider.plugin.prepend('<div class="ps-current"><ul></ul><span class="ps-caption"></span></div>');
pgwSlider.plugin.prepend('<div class="ps-current"><ul></ul><span class="ps-caption"></span><span class="ps-long-description"></span></div>');
pgwSlider.slideCount = pgwSlider.plugin.find('.ps-list > li').length;

if (pgwSlider.slideCount == 0) {
Expand Down Expand Up @@ -251,19 +251,23 @@
var elementId = 1;
pgwSlider.plugin.find('.ps-list > li').each(function() {
var element = getElement($(this));

element.id = elementId;
pgwSlider.data.push(element);

$(this).addClass('elt_' + element.id);


$(this).find('span.pgwSlideDescription').remove();

// Check element title
if (element.title) {
if ($(this).find('span').length == 1) {
if ($(this).find('span').text() == '') {
$(this).find('span').text(element.title);
if ($(this).find('span.pgwSlideTitle').length == 1) {
if ($(this).find('span.pgwSlideTitle').text() == '') {
$(this).find('span.pgwSlideTitle').text('');
}
} else {
$(this).find('img').after('<span>' + element.title + '</span>');
$(this).find('img').after('<span class="pgwSlideTitle">' + element.title + '</span>');
}
}

Expand All @@ -276,6 +280,12 @@
currentElement.html('<img src="' + element.thumbnail + '" alt="' + (element.title ? element.title : '') + '">');
}


if(element.description){
currentElement.html(currentElement.html() + '<div style="divcaption">' + element.description + '</div>');
}
console.log(element);

if (element.link) {
currentElement.html('<a href="' + element.link + '"' + (element.linkTarget ? ' target="' + element.linkTarget + '"' : '') + '>' + currentElement.html() + '</a>');
}
Expand Down Expand Up @@ -367,7 +377,6 @@
pgwSlider.touchFirstPosition = null;
});
}

return true;
};

Expand All @@ -377,12 +386,12 @@
// Element caption
var elementText = '';
if (element.title) {
elementText += '<b>' + element.title + '</b>';
elementText += '<h2>' + element.title + '</h2>';
}

var elementDescription = '';
if (element.description) {
if (elementText != '') elementText += '<br>';
elementText += element.description;
elementDescription += element.description;
}

if (elementText != '') {
Expand All @@ -392,9 +401,11 @@

if (typeof pgwSlider.plugin.find('.ps-caption').fadeIn == 'function') {
pgwSlider.plugin.find('.ps-caption').html(elementText);
pgwSlider.plugin.find('.ps-long-description').html('<p class="ps-long-description-p">' + elementDescription + '</p>');
pgwSlider.plugin.find('.ps-caption').fadeIn(pgwSlider.config.transitionDuration / 2);
} else {
pgwSlider.plugin.find('.ps-caption').html(elementText);
pgwSlider.plugin.find('.ps-long-description').html(elementDescription);
pgwSlider.plugin.find('.ps-caption').show();
}
}
Expand Down Expand Up @@ -590,6 +601,7 @@
return false;
}


if (typeof direction == 'undefined') {
direction = 'left';
}
Expand Down