Thanks so much, that did the trick!
Rich
On Wednesday, April 24, 2013 3:47:43 PM UTC-6, iange87 wrote:
>
> When you activate the carousel in JS, the code activates both as the same
> time. If you want them to work separately, you need to give each a unique
> ID, then activate them individually:
> $('#myCarousel').carousel({interval:5000})
>
> and
>
> $('#testimonials').carousel({interval:false}) .carousel initiates
> anything with that class the same, where as using #<id name> lets each have
> it's own settings. Also, if you're referencing bootstrap.min.js, you
> shouldn't need all the others too. The main js file should include all the
> components.
>
> On Wednesday, April 24, 2013 9:27:23 PM UTC+1, Rich Leach wrote:
>>
>> I thought this would be important:
>>
>> I'm making these script calls at the bottom of my page to facilitate load
>> times; the carousel code is above these script calls on the page.
>>
>> <script src="http://code.jquery.com/jquery-latest.js";></script>
>> <!-- Le javascript ================================================== -->
>> <!--
>> Placed at the end of the document so the pages load faster --> <script
>> src="/default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap.min.js<http://svr2.tomboytools.us/default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap.min.js>
>> "></script> <script type="text/javascript" src="
>> http://platform.twitter.com/widgets.js";></script> <script src="
>> /default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-transition.js<http://svr2.tomboytools.us/default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-transition.js>
>> "></script> <script src="
>> /default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-alert.js<http://svr2.tomboytools.us/default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-alert.js>
>> "></script> <script src="
>> /default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-modal.js<http://svr2.tomboytools.us/default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-modal.js>
>> "></script> <script src="
>> /default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-scrollspy.js<http://svr2.tomboytools.us/default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-scrollspy.js>
>> "></script> <script src="
>> /default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-tab.js<http://svr2.tomboytools.us/default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-tab.js>
>> "></script> <script src="
>> /default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-tooltip.js<http://svr2.tomboytools.us/default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-tooltip.js>
>> "></script> <script src="
>> /default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-popover.js<http://svr2.tomboytools.us/default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-popover.js>
>> "></script> <script src="
>> /default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-button.js<http://svr2.tomboytools.us/default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-button.js>
>> "></script> <script src="
>> /default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-collapse.js<http://svr2.tomboytools.us/default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-collapse.js>
>> "></script> <script src="
>> /default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-carousel.js<http://svr2.tomboytools.us/default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-carousel.js>
>> "></script> <script src="
>> /default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-typeahead.js<http://svr2.tomboytools.us/default/includes/themes/MuraBootstrap/bootstrap/js/bootstrap-typeahead.js>
>> "></script> <script type="text/javascript"> $('.carousel').carousel({
>> interval:
>> 5000 }) </script> </body> </html>
>>
>> Hope this helps.
>>
>> Rich
>>
>>
>>
>>
>>
>>
>> On Wednesday, April 24, 2013 1:52:26 PM UTC-6, Rich Leach wrote:
>>>
>>> ... oh, in case you're wondering I'm working in ColdFusion so the double
>>> pound/hash signs ("##") are needed to escape the pound signs in the anchor
>>> tags.
>>>
>>> Rich
>>>
>>>
>>>
>>> On Wednesday, April 24, 2013 1:49:27 PM UTC-6, Rich Leach wrote:
>>>>
>>>> Hi
>>>>
>>>> I already have 1 carousel on a web page (working nicely) and I need a
>>>> second, smaller carousel that I would like to pause on page load. The
>>>> problem is that when the page loads the second carousel starts rotating.
>>>> It's a simple carousel, I'm sure I'm just missing a command somewhere
>>>> but for the life of me I can't debug it.
>>>>
>>>> The code for the second carousel is below (I named the first carousel
>>>> "myCarousel" in case you were wondering ;-) )
>>>>
>>>> <div class="carousel slide" id="testimonials" style="margin-top:-10px;
>>>> padding:10px; height:120px; border:thin solid silver;" data-pause="true">
>>>> <div class="carousel-inner">
>>>> <div class="item active">
>>>> <div>
>>>> This is item 1.
>>>> </div>
>>>> </div>
>>>>
>>>> <div class="item">
>>>> This is item 2.
>>>> </div>
>>>>
>>>> <div class="item">
>>>> This is item 3.
>>>> </div>
>>>> </div>
>>>>
>>>> <a href="##testimonials" class="carousel-control left"
>>>> data-slide="prev" style="margin-left:-70px;">«</a> <a
>>>> href="##testimonials" class="carousel-control right" data-slide="next"
>>>> style="margin-right:-70px;">»</a>
>>>> </div>
>>>>
>>>> Any ideas on how I make this carousel stop automatically rotating?
>>>>
>>>> Thanks in advance,
>>>>
>>>> Rich
>>>>
>>>
--
You received this message because you are subscribed to the Google Groups
"twitter-bootstrap" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
For more options, visit https://groups.google.com/groups/opt_out.
