Forums » Customize

Slide Viewer & Text Arrangement

  • Pages:
  • 1
  • 2
lemathieu A
FRANCE
2009-10-25 22:32:53
Permalink Post
 

I transform the Slider from Arsondpi to the SliderPro
Based on this plugin and the SlideViewerPro javascript, it's more customisable, has thumbnails and can be automated.

The exhibit.sliderPro.php comes with an automatic version, the exhibit.sliderProAuto.php that you will install like all the other plugins, in ndxz-studio/site/plugin.
This plugin works better when all your images have the same height an width. If not he will take the bigger size as the "norm".

Needs
All this elements are in the sliderPro_elements folder :
1) the latest jquery framework (updating jquery plugin means that you're gonna loose thickbox as an exhibition method)
2) jquery.slideViewerPro.1.0.js
3) jquery.timers.js
4) and of course the plugins, sliderPro and sliderProAuto



You can download it here.

It has been tested on Mac on Firefox, Opera and IE8.
Let me know how you feel it !

sakisan
FRANCE
2009-10-25 23:54:05
Permalink Post
 

@lemathieu

1- you made a mistake here :
// images
    $s .= "< div id='img-container'>\n";
    $s .= "< div id='slider' class='svw'>\n";
    $s .= "< ul>\n";
    $s .= $a;
    $s .= "< /ul>\n";
    $s .= "< /div>\n";
    $s .= "< /div>\n\n";

as it's written on the sliderpro website we must have a svwp class not a svw then during the loading your images won't appear as a list as with your file.

2- I don't see where you're calling the css file you give in the css folder?
On my side, when i did it with the float left plugin i put :
$exhibit['lib_css'] = 'svwp_style.css';

Then i didn't add the css in the dynamic functiun inside the plugin php (why do you have a css file in a folder and put the css in the php?).

3- I noticed another mistake in the js (line 26):
jQuery("div.svwp").prepend("< img src='http://hmplus.net/public_html/test/files/svwloader.gif' class='ldrgif' alt='loading...'/ >"); //change with YOUR loader image path

If you tell to people to put the loader image in the folder "files", the adress must be yoursite/files/svwloader.gif

4- i don't see the utility to publish 2 plugins when there are a lot of options to customize the slideshow from only one plug file.
why don't you let all the options with the comments?
So everyone could get all the customization's benefits :

galBorderWidth: 0,                     // the border width around the main images
        thumbsBorderWidth: 1,                     // the border width of each thumbnail. Note that the border in reality is above, not around
        easeTime: 750,                             // the time it takes a slide to move to its position
        asTimer: 6000,                             // if autoslide is true, this is the interval between each slide
        thumbsBorderColor: '#ffffff',             // the border color of the thumbnails but not the current one
        thumbsActiveBorderColor: '#00cccc',     // the border color of the current thumbnail
        thumbsRightMargin: 15,                     // the distance of each thumnail respect to the next one
        buttonsTextColor: '#666666',             //the color of the optional text in leftButtonInner/rightButtonInner
        buttonsWidth: 10,                         // the width of the prev/next buttons that commands the thumbnails
        thumbs: 6,                                 // the number of visible thumbnails
        thumbsPercentReduction: 10,             // the percentual reduction of the thumbnails in relation to the original
        thumbsVis: false,                         // with this option set to false, the whole UI (thumbs and buttons) are not visible
        leftButtonInner: '&larr',                 //could be an image or an escaped char
        rightButtonInner: '&rarr',                 //could be an image or an escaped char;
        autoslide: true,                         // by default the slider do not slides automatically. When set to true REQUIRES the jquery.timers plugin
        typo: true,                             // the typographic info of each slide. When set to true, the ALT tag content is displayed
        typoFullOpacity: 0.7,                     // the opacity for typographic info. 1 means fully visible.
        shuffle: true                             // the LI items can be shuffled (randomly mixed) when shuffle is true

5- I'm a noob and learning to use php and js since a use indexhibit (something like 2 weeks ago) so i don't konw the utility of tooltips, is this js must be loaded here? what is it for?

6- a link to see it in action could be welcomed

7- your name is well written in the @author ;-P

I hope it could help you, but i think it'll be better if any real php and js skilled people could have a look before we share our files with everyone.

lemathieu A
FRANCE
2009-10-26 08:07:35
Permalink Post
 

it's here for that : inputs from everybody.
Feel free to modify it (as I'm not a real php and js guy neither)… And to share it back to the community. I wrote it in regards of the progress of this thread, without possibility for really non coders (as 98% on this forum) to grab it.

1/ cool you found it !

2/ I've done it as it was in the "normal" slider

3/ yeah it's because I've done it on a test indexhibit site. And I forgot to change it.

4/ sure

5/ …

6/ oh yes !

7/ Shameless

;)

arsondpi A
GREECE
2009-10-26 08:21:10
Permalink Post
 

Thanks Mathieu! A new exhibition format!...

Sakisan tooltips are these yellow boxes with text defined in html by the titleattribute. Javascript tooltips is a high end version of this -you can style them, add effects etc. Google it!!!

I don't think new ideas and plugin should be double checked - they can be "works in progress - use at your own risk". While on the learning process it's unavoidable to make mistakes. You try things - they work or they break. It's on the makers discretion to do his best before the first release, and then its up to the rest of us to pitch in and keep evolving it...

Here's a simple test.

I would edit the titles/captions to be set under the images. And maybe an on-click advance image feature...

lemathieu A
FRANCE
2009-10-26 12:37:00
Permalink Post
 

hey pindaros I like your "sponge bob fucker" ! Is it you ?

And for the "n-click advance image feature", I agree with you but didn't know how to…
Shame on me.

;)

sakisan
FRANCE
2009-10-26 14:00:00
Permalink Post
 

Hello Arson,
thanks for tooltips. I looked in google, but i didn't understood the necessity of this js in the plugin. I don't have enough knowledges about js and i hearded that was better to load only the usefull. :-$

Anyway, here are my files for the sliderpro floatleft as i did it in the last link you saw last week.
As you said, it's "work in progress"! It works for me on Firefox and safari but i didn't check it on IE.
Thanks in advance to any php or/and js skills to optimize it!
Especially about the on-click advance that i would appreciate a lot as well :-P

About lemathieu's files you put in simple test, don't forget to change the svw class on svwp class. At the moment, the images are displaying as a list with bull-points during the loading.

@lemathieu,
2- don't take it bad, i'm learning all this stuff exactly as you! I hope it's always great work to participate and tried to do it. You copied-pasted some things missing some logical ways to do i guess.
Normal slider doesn't use an external css. Slidepro do it and you can have a look on the exhibit.thickbox for this.

Enjoy and make it better ;-)

weenuh24
UNITED STATES
2009-10-27 16:39:00
Permalink Post
 

Is it possible to separate the caption from the image and move it below the thumbnails? Working on a photo site and that is a request from client. argghh! not so savvy with javascript... help!!! :)

arsondpi A
GREECE
2009-10-27 16:49:26
Permalink Post
 

Everythings possible - client project??? cmon... read the forum rules. This is a free forum...

weenuh24
UNITED STATES
2009-10-27 18:20:49
Permalink Post
 

sorry! have just been searching all over the place!! wasn't thinking. thanks :)

doki
SLOVAKIA
2009-12-30 13:12:42
Permalink Post
 

Hi,

i have a questions. How set numbers above the slider?
Here is numbers bottom and i need numbers [1 2 3...] set in top. Thx and sorry for my english : )

Lenzznel
NETHERLANDS
2010-02-07 15:20:46
Permalink Post
 

Hi all, Thanks for the great slider.float.left exhibit. I got it running and modifyed it to have the text below the slidewhow (here), that's what I was wishing for!

There's still one bug which I cannot resolve, it's always showing:

Notice: Undefined variable: s in /customers/atelierehia.com/atelierehia.com/httpd.www/ndxz-studio/site/plugin/exhibit.sliderFloatLeft.php on line 66

addressing this line:

// images
$s .= "< div id='slider' class='svw'>\n";

What's the undefined variable here? Any idea?

Lenzznel
NETHERLANDS
2010-02-09 12:16:29
Permalink Post
 

Alright, the slideviewer functions, just this little thing with the undifined variable s.

Now I was opening the page in IE and the slideshow and text were completely placed somewhere else. That's the page: Example

Does it have something to do with float left? Anybody knows how to avoid this?

Lenzznel
NETHERLANDS
2010-02-09 14:58:41
Permalink Post
 

Now I switched off the Error notice for php and yea, everything works fine. The error might be just hidden and I hope it just doesn't appear somewhere unexpected. It even works in IE!

farwest1
UNITED STATES
2010-02-22 16:55:37
Permalink Post
 

Ok, I am trying to set SlideViewerPro up. I've installed all of the files from the jQuery site. I modified the (div id="basic"....) section so that it finds my img files. But they don't appear on the opening page (Incidentally, if I switch to the Grow theme, the images do appear in a vertical line.) What appears on my homepage instead of the imgs is this code:

$(window).bind("load", function() {
$("div#basic").slideViewerPro();
});

I've also tried to add:

$("div#basic").slideViewerPro({
galBorderWidth: 0,
autoslide: true,
thumbsVis: false,
shuffle: true
});

...but then the code appears on my homepage rather than an image.

Between the "head" tags of my index.php file, I've inserted the div id="basic" paths to my images and the code above, as well as the style sheet links to svwp_style.css.

I think my issue is where to put various pieces of code. For instance, does the code I show above go in between the "head" tags of index.php or somewhere else?

Hopefully this is enough info to help me troubleshoot my problem. I'm a noob at this, so any help would be appreciated.

rickykappa
ITALY
2010-02-22 19:42:29
Permalink Post
 

you didn't post your page...

Showing 26 - 40 of 65 posts in Forum > Customize > Slide Viewer & Text Arrangement
 
  • Pages:
  • 1
  • 2

You need to be logged in to post.