PDA

View Full Version : syntax error when pasting code



theremotedr
02-09-2018, 09:51 PM
Hi,
The code in use is shown below.
I would like to add this extra code also below at line 220 but when i do i get a syntax error.
Can you advise why.
Thanks


$rgGallery.find(‘div.rg-image’).fadeOut(500, function() { //Fade-Out

$rgGallery.find(‘div.rg-image’).empty( ).append(”) //Image change

}).fadeIn(500); //Fade-In


var $loader = $rgGallery.find('div.rg-loading').show();

$items.removeClass('selected');
$item.addClass('selected');

var $thumb = $item.find('img'),
largesrc = $thumb.data('large'),
title = $thumb.data('description');

$('<img/>').load( function() {

$rgGallery.find('div.rg-image').empty().append('<img src="' + largesrc + '"/>');

if( title )
$rgGallery.find('div.rg-caption').show().children('p').empty().text( title );

$loader.hide();

if( mode === 'carousel' ) {
$esCarousel.elastislide( 'reload' );
$esCarousel.elastislide( 'setCurrent', current );
}

anim = false;

}).attr( 'src', largesrc );

},
addItems = function( $new ) {

$esCarousel.find('ul').append($new);
$items = $items.add( $($new) );
itemsCount = $items.length;
$esCarousel.elastislide( 'add', $new );

};

return {
init : init,
addItems : addItems
};

})();

Gallery.init();

styxlawyer
02-10-2018, 01:42 PM
The double quotes in this line aren't balanced:



.
$rgGallery.find(‘div.rg-image’).empty().append(”) //Image change
.


You could try either:



.
$rgGallery.find(‘div.rg-image’).empty().append("") //Image change
.


or



.
$rgGallery.find(‘div.rg-image’).empty().append() //Image change
.

jscheuer1
02-10-2018, 02:48 PM
Actually, you can't use those type of quotes as delimiters in javascript at all. The kind of quotes you cannot use:


‘ and ’

These are the left leaning and right leaning single quote marks. You also cannot use the the left leaning and right leaning double quote marks. The only type of quotes used as delimiters in javascript are:


' and "

Those are the straight up and down single and the straight up and down double quote marks.

There could also be other problems.

Corrected code:


$rgGallery.find('div.rg-image').fadeOut(500, function() { //Fade-Out

$rgGallery.find('div.rg-image').empty( ).append('') //Image change

}).fadeIn(500); //Fade-In

theremotedr
02-10-2018, 05:06 PM
Hi,
jscheuer1

I have entered your code which works as opposed to my incorrect code which didnt.

I then noticed that the main image would be hidden after the fade in/out etc and the thumbnails would return to top of screen.
I then added the following to the .rg-image style css min-height:600px;

This has now stopped the main image from being hidden by thumbs returning to top of screen but the main image is now just hidden after the fade in/fade out etc.

So,
I click thumbnail,
Main image is shown.
Then main image is gone & now just an empty container.

Can you advise please

Thanks

jscheuer1
02-10-2018, 11:19 PM
I'm pretty sure that for I or anyone else here to help with that, we would need a link to the problem page, and perhaps even instructions as to exactly what to do in order to see the problem happen.

theremotedr
02-11-2018, 10:19 AM
Hi,
Sorry about that,sometimes the obvious isnt obvious to me.
Here is the page in question http://www.theatticbanwell.co.uk/slideshow.html

Just click a thumbnail to see the issue with the main image that should be displayed.

If the code that i used is just wrong completely then the look im looking for is a fade in / fade out affect between each main image change.
Before you clicked a thumbnail & the main image was shown,this main image would stay shown until another thumbnail was clicked.

So the look now is to have some kind of transition between each main image change when thumbnail selection.

Many thanks.

jscheuer1
02-11-2018, 04:33 PM
We may have to play around with this a bit, but I think I see the problem and this should fix it. Change:


$rgGallery.find('div.rg-image').empty().append('<img src="' + largesrc + '"/>');
$rgGallery.find('div.rg-image').fadeOut(500, function() { //Fade-Out
$rgGallery.find('div.rg-image').empty( ).append('') //Image change
}).fadeIn(500); //Fade-In

to:


$rgGallery.find('div.rg-image').fadeOut(500, function() { //Fade-Out
$rgGallery.find('div.rg-image').empty().append('<img src="' + largesrc + '"/>').fadeIn(500); //Image change and Fade-In
});

Note: Don't copy code from a message the forum sends you, it might be corrupt, instead log on and copy from the post.
The browser cache may have to be cleared and/or the page refreshed to see changes

theremotedr
02-11-2018, 04:59 PM
Evening,
I have applied the new code as advised.
That issue seems to have been now sorted.

Adjusting the values on fade in / out doesnt make much difference that i can see, or is it me ?

I have cleared cache / cookies & you can see the affect here please.

http://www.theatticbanwell.co.uk/slideshow.html

Thanks very much if you could advise something a little more appealing etc.

theremotedr
02-11-2018, 06:27 PM
I have noticed the following also.

Say you select the second image in the thumbnails & it is now shown as the main image.
When you then select another thumbnail image i see just the new selected image fade in & fade out,same image twice.

I thought it would fade out the current main image & then fade in the new selected image,old then new images.

Thanks

jscheuer1
02-11-2018, 06:38 PM
I meant to also get rid of the highlighted line:


$rgGallery.find('div.rg-image').empty().append('<img src="' + largesrc + '"/>');
$rgGallery.find('div.rg-image').fadeOut(500, function() { //Fade-Out
$rgGallery.find('div.rg-image').empty().append('<img src="' + largesrc + '"/>').fadeIn(500); //Image change and Fade-In
});

theremotedr
02-11-2018, 06:46 PM
Many thanks,
Ive now deleted it and fine.

I will play with speed etc.

On a side note do you have any advice for this please.

<li><img src="images/thumbs/188.jpg" data-large="images/fulls/188.jpg" data-description="Coffee table foot stool £90 H 40cm W 123cm D 43cm" /></a></li>

Currently shows as Coffee table foot stool £90 H 40cm W 123cm D 43cm

But i need it like so,

Coffee table foot stool £90
H 40cm W 123cm D 43cm

jscheuer1
02-11-2018, 07:05 PM
If that's with the same page and script, you can just put the <br> right in there, but you have to change this in the script:


if( title )
$rgGallery.find('div.rg-caption').show().children('p').empty().text( title )

to:


if( title )
$rgGallery.find('div.rg-caption').show().children('p').empty().html( title )

But I'd caution against that. It looks fine to me the way it is, and having a br in there might throw the layout off.

theremotedr
02-11-2018, 07:27 PM
Thanks,
I changed it from .text to .html and then added the <br> but i then just see the <br> with the code without breaking.

The reason i required it on two lines was on mobiles etc the text would continue to the right then drop to a second line.
But depending on what the text was you would see something like this.

Coffee table foot stool £90H 40cm W 1
23cm D 43cm

Hence why i wanted to make a break after the £90 etc.

This would apply to all the items items.
Do you have anything up your sleeve which would add a break for just mobile etc,obviously pc is fine.

Doing it by width etc wont work as you then need to specify a fixed amount.
Where this might be perfect,

Coffee table £90
H W D etc etc

This wouldnt.
Lovely double pine wardrobe £125
H W D

Reason being character count etc
Hence why a break after the price.

thanks

jscheuer1
02-11-2018, 07:31 PM
I'm looking at the script, it hasn't been changed. With the .text() you get the literal text. With .html() you get the html code as html.

theremotedr
02-11-2018, 07:38 PM
wait.
Its now working for me

theremotedr
02-11-2018, 07:43 PM
Chrome went asleep for a while

theremotedr
02-12-2018, 08:27 AM
Hi,
Jscheuer1
Can you take a look & advise her please http://www.dynamicdrive.com/forums/showthread.php?81982-Select-active-thumb-with-border&p=323561#post323561

Thanks for your time.

theremotedr
02-12-2018, 10:33 PM
All sorted no thanks

jscheuer1
02-13-2018, 01:36 AM
All sorted no thanks

Well, I do like to give other folks a chance to contribute. And, if I tried answering everything myself, I might go nuts. Glad you got your answer.

theremotedr
02-13-2018, 09:46 AM
Thanks for the follow up.