JQuery :: Galleriffic - Changing Settings After Initialize?
Dec 16, 2011
Does anyone know if there is a way to change the defaults such as number of thumbnails after initialisation? e.g.$('.changeTo16').live('click', function(){//set gallerific stuffnumThumbs: 16});$('.changeTo8').live('click', function(){//set gallerific stuffnumThumbs: 8}); etc...
I create a slideshow with thumbs using jquery plug-in galleriffic. To scroll the thumbs, I stylized a scrollbar using jquery plug-in jscrollpane and add another plug-in, mousewhell.
But this combinations make scrollbar inoperable. When the pages open, the scrollbar is hidden and the mousewhell doesn't work.
I'm working on a gallery site using galleriffic. It is composed of 13 seperate galleries (couldn't figure out a way to integrate them into one) and what I would like is an index page which users can jump to any specific image in a gallery. [URL]. There is a current example, and what I'm trying to do is make a drop down menu form where someone could select a piece of granite, (eg. Giallo Latina) and it would jump them straight to that page. However if I link to "butterscotch.html#5" it doesn't work. Is there any way of creating a drop down menu that could handle this?
any one here familiar with GALLERIFFIC? i try insert my own hyperlink in slideshow container instead of �next image�, user may go to my own link when click on the large image, what should i edit? [URL]
I'm interested in putting on a simple, fade, slideshow. I followed the directions according to this link: [URL]. Here's my code in the <head> </head> <style type="text/css"> .slideshow { height: 232px; width: 232px; margin: auto } .slideshow img { padding: 15px; border: 1px solid #ccc; background-color: #eee; } </style> <!-- include jQuery library --> <script type="text/javascript" src="[URL]"></script> <!-- include Cycle plugin --> <script type="text/javascript" src="[URL]"></script> <!-- initialize the slideshow when the DOM is ready --> <script type="text/javascript"> $(document).ready(function() { $('.slideshow').cycle({ fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc... }); }); </script>
I uploaded the.JS files. And here's the HTML: <div class="slideshow"> <img src="[URL]" width="200" height="200" /> <img src="[URL]" width="200" height="200" /> <img src="[URL]" width="200" height="200" /> <img src="[URL]" width="200" height="200" /> <img src="[URL]" width="200" height="200" /> </div> They are just stacked up, nothing's happening. Check it out: [URL].
As you no doubt know, a link that is generated on the fly (ie by a JS function) and is supposed to invoke a ColorBox (due to a predefined selector) doesn't work as the link didn't exist when the ColorBox was initialised e.g., you have this in the head: $(document).ready(function(){ $(".frmMe").colorbox({iframe:true, innerWidth:1200, innerHeight:640}); }
Then a link generated by JS at a later time (for example triggered by a users click) like: <a href="blah.php" class="frmMe">Easter Eggs</a>
Whenever I dynamically create a link like the one above, I re-run the line: "$(".frmMe").colorbox({iframe:true, innerWidth:1200, innerHeight:640});" afterwards to ensure the colorBox functionality works.
Now however, I have an instance where a link on a parent page like the above is created from within an iFrame (on the fly using JS). Unfortunately however, I haven't been able to find a way to re-intialize the ColorBox on the parent page from within the iframe to ensure that the new link has ColorBox functionality enabled.
I have tried: $('.frmMe', parent.document.body).colorbox({iframe:true, innerWidth:1200, innerHeight:640}); but it seems to have no affect and generates no errors (yet this follows the format I use to create the link. On the page which is: $('#updateBx', parent.document.body).html('<a href="" class="frmMe">Glorious</a>');
I'm initializing a lightbox type plugin after an ajax response. The plugin is usually initialized with .ready, but I've read on this forum that .ready won't work after page load or with dynamic loading. Most posts say to initialize right after the ajax response... I've done this and it works for the first ajax load, but not for the subsequent ajax loads. It should trigger the same code every time ajax is called since it goes through the same function, but it doesn't.
Project Info: This project seems pretty simple... There are links that load content into a DIV via ajax... the content is made up of thumbnails that should launch lightbox...Is there a good way of dynamically initializing plugins after ajax load?
How to declare and initialize an array with key/values using JavaScript and then dynamically creating select dropdown and assigning key/values to the options using JavaScript?
I understand that there is no need to initialize a variable at the point of declaration. OTH, what is the default type of a [declared] variable? For example:
I am trying to initialize form elements with the values retrieved from an excel file. I am able to read from excel, but unable to initialize the form elements to values retrieved. No idea where I am going wrong.. code...
I have a table that gets served off to a 3rd party site. Each row has "track" and "hide" checkboxes ... I need to save/update these settings as the user updates their settings so I can call them back later on future visits.
(cookies are not an option... because that is too easily lost and there could be thousands of settings over time)
So, I am leaning toward a AJAX POST using Jquery. Rather than submit on every change... I would like to store the settings in JavaScript and then batch submit every 30 seconds or on page unload. I have most if this working... it is the saving of the data and then batch submission code that I am after.
Let me give you the use case and a scenario:
Table with 100 rows and each row has "track" and "hide". Each row may be associated with one "subject" and multiple rows may have the same subject ... so when you track or hide... it tracks multiple rows (highlights, checks their boxes, and grabs the subject from a row field) OR it "hides" multiple rows based on their subject.
All that is working. (Yes!)
Now, because they could be clicking quickly through... they might track then "untrack" the same subject or hide then "unhide" the same subject all within a very short period of time.
I don't want all those AJAX calls!
So, I need some sort of data storage for the "subjects" that puts them in "track" and "hide" datasets ... removes them out if undone ... and occasionally submits whatever the queued up actions are (if any).
Also, there may be settings grabbed on page load that need undone (the track and hide setting grabbed from the DB that pre-dated that visit) ... so it may not as simple as removing from a data set... there should be an explicit "untrack" & "unhide" submission in those cases to update the DB.
I'm using serialscroll jquery plugin from ariel Flesler on this page : http://goo.gl/HMNUX the width of the container (#slideshow) is 100% of the window's width. everything is fine until the user resize the window. Then the pictures are not in the right position anymore. should reset the "offset" setting of the plugin on resize. I tried this, but it doesn't work :
When the number of menus (including a menu and its submenus) reach a particular number, then after that rest of the menus are not getting displayed. Is there any settings available to restrict number of menus in superfish?
I had problem when try to reuse div element with ui.dialog().If I set the width & height the first time it works; but if I call it from second function with different width & height it won't apply the new setting. Also if I manually resize the dialog when it appear after close and reopen it use the new size (resized manually) not the one I specified in the code.is it possible to resize the dialog before it show up?
I'm now writing a web page where I have to display amounts/dates in the same format used by the loca PC. This means sometimes in italian (1.234,56) and sometimes in the US format (1,234.56). Any idea how, from js, I can retrieve the PC's regional setup ?
I want to let users to print an automatic generated image from a web page. the problem is that the image is big (little smaller than A4) and if I print the page from "File --> Print" the image is automatically resized or printed in more than one page, if I set the page properties from the File menu I can reduce print margin and cut off header and footer, and then it works fine. So I would like to set page properties form javascript to let users print the image with right dimensions.
Is there a way to test for security settings in a users browser AND their firewall. Lets say someone is using zonealarm. Is there a way to test for their setting in zonealarm, so I can then redirect them to a specific page.
The reason I am asking is that I have a flash front page. A user cannot see the page because he has his security settings set so that he does not see activex controls. I want to be able to test for those settings then redirect him to a static page.
I have a log file that is viewed on the local machine. There are some settings on the html page that allow the user to specify how the file is viewed. I'm just wnodering what are my options in saving these settings (so they could be reloaded next time the user loads the page). Writing to registry, a file, or a cookie? what's the right approach?
I don't know whether this is a css problem or a javascript problem. My js knowledge is very basic. I purchase some javascript from Project7 to scroll my pages vertical, and I am having a small problem. There is probably a fairly simple solution, but I can't figure it out.
In this first example, the top padding for the first page is set to 0. Everything works well until the home button is clicked:
Test 1
In the second example, the first page has the a padding of 260px, same as all other sections (the header is also 260 px). When the page loads, there is a 260px gap between the header and the first section. Once any button is clicked, everything is works fine. Even if the page is refresh, it works fine.
Test 2
I have been playing around with this for hours and I cannot figure out how to set everything right.
I am using this settings to init my tinyMCE but unfortunelty its not working on IE..
HTML Code: var config = { settings : {[code]....
SCRIPT5: Access is denied.line 94 is the init function.. and when im using the init function without the settings then its working on explorer too :S tinyMCE.init( ); what am i doing wrong?
Is there an easy way to detect the local language setting of a client browser?
I would like to determine if the users browser is set to English, French, Italian or German language and display a message in the appropriate language but don't want to redirect user.