javascript - loading a specific slide in carousel in modal in bootstrap -

-

I have a list of thumbnails, while clicking on them on Bootstrap 3 page, I want to open a model that contains each Additional info for the thumbnail is the carousel.

I think that when I click on the thumbnail, the window opens with a specific slide in opening.

I am trying the following, but use the "data-target" to set the "Data-Slide-to" attribute goal of the "Data Toggle" and Carousel of both models, but this In the case, the targets are two different IDs ("#mymodal" and "#gallery" estimated). I can not have a "data-target" on the same HTML tag Is this a way to hack easily? Sorry, I'm not a god.

This is the list of thumbnails: 

  & lt; Div class = "container" & gt; & Lt; Div class = "row" & gt; & Lt; Div class = "colonel-xs-6 call-sh-4 column-md-3" & gt; & Lt; IMG src = "http://placehold.it/150x75&text=item1" data-toggle = "modal" data-target = "#mymodel" data-slide-to = "0" & ​​gt; & Lt; / Div & gt; & Lt; Div class = "col-xs-6 col-sm-4 col-md-3" & gt; & Lt; Img src = "http://placehold.it/150x75&text=item2" data-toggle = "modal" data-target = "#mymodel" data-slide-to = "1" & gt; & Lt; / Div & gt; & Lt; Div class = "colonel-xs-6 call-sh-4 column-md-3" & gt; & Lt; IMG src = "http://placehold.it/150x75&text=item3" data-toggle = "modal" data-target = "#mymodel" data-slide-to = "2" & gt; & Lt; / Div & gt; & Lt; Div class = "colonel-xs-6 col-sm-4 col-md-3" & gt; & Lt; Img src = "http://placehold.it/150x75&text=item4" data-toggle = "modal" data-target = "#mymodel" data-slide-to = "3" & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Div & gt;   
 And here is the model code:  
  & lt; Div class = "modal fade" id = "mymodal" tabindex = "- 1" role = "dialog" aria-labelledby = "myModalLabel" aria-hidden = "true" & gt; & Lt; Div class = "modal-dialog" & gt; & Lt; Div class = "modal-content" & gt; & Lt; Div class = "modal-header" & gt; & Gt; Button type = "button" class = "off" data-discarded = "model" & gt; & Lt; Span aria-hidden = "true" & gt; & Amp; Times; & Lt; / Span & gt; & Lt; Span class = "sr-only" & gt; Close & lt; / Span & gt; & Lt; / Button & gt; & Lt; / Div & gt; & Lt; Div class = "modal-body" & gt; & Lt; Div id = "gallery" square = "carousel slide" data-interval = "wrong" & gt; & Lt; Div class = "carousel-interior" & gt; & Lt; Div class = "item active" & gt; & Lt; Img src = "http://placehold.it/600x400&text=item1" alt = "item1" & gt; & Lt; Div class = "carousel-caption" & gt; & Lt; H4 & gt; Title 1 & lt; / H4 & gt; & Lt; P & gt; This is the description. & Lt; / P & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; Div class = "item" & gt; & Lt; Img src = "http://placehold.it/600x400&text=item2" alt = "item2" & gt; & Lt; Div class = "carousel-caption" & gt; & Lt; H4 & gt; Title 2 & lt; / H4 & gt; & Lt; P & gt; This is the description. & Lt; / P & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; Div class = "item" & gt; & Lt; Img src = "http://placehold.it/600x400&text=item3" alt = "item3" & gt; & Lt; Div class = "carousel-caption" & gt; & Lt; H4 & gt; Title 3 & lt; / H4 & gt; & Lt; P & gt; This is the description. & Lt; / P & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; Div class = "item" & gt; & Lt; Img src = "http://placehold.it/600x400&text=item4" alt = "item4" & gt; & Lt; Div class = "carousel-caption" & gt; & Lt; H4 & gt; Title 4 & lt; / H4 & gt; & Lt; P & gt; This is the description. & Lt; / P & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; One class = "left the goose control" href = "# gallery" roll = "button" data-slide = "back" & gt; & Lt; Span class = "glyphicon glyphicon-chevron-left" & gt; & Lt; / Span & gt; & Lt; / A & gt; & Lt; A class = "right carousel-control" href = "# gallery" role = "button" data-slide = "next" & gt; & Lt; Span category = "glyphin glyphine-chevron-right" & gt; & Lt; / Span & gt; & Lt; / A & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Div & gt;    
 
 
 You can wrap the image in anchor which targets this kind of carousel Is:      
 Demo:

Comments

Post a Comment

Popular posts from this blog

ios - Adding an SKSpriteNode to SKScene from a child SKSpriteNode -

-
I have a SKScene where I am adding an SKSpriteNode I have subclassed the SKSpriteNode class to create this node. In the subclass I am defining some SKActions on Sprite. What do I want to do when the end of this phantom ends the SKAction sequence, then I add a new Prayer node to this scene. How is this possible. The following code is mine: The code for the sequence is that I'm running on the Scansprinitode subclass (TEMissileNode): - SKAction * moveDown = [SKAction moveToY: Self.position.y - 20 Duration: 0.2]; SKAction * animation = [SKAction animateWithTextures: textures timePerFrame: time / 7]; SKAction * moveMissileProjectile = [SKAction Moving: Pointoffscreen Term: Time]; SKAction * group = [SKAction group: @ [animation, movement projectile]]; SKAction * Sequence = [SKAction Sequence: @ [Hilldown, Group, [SKAction removalFromParent]]]; [Self run action: sequence]; From the main scene, I call those actions that execute these tasks TEMissileNode * missile = [tmissil...
Read more

Matlab transpose a table vector -

-
An embarrassing simple question seems to be, but how can I move a Matlab table vector? aTableT = aTable '; I tried a standard syntax for the simple interaction of a line vector to a line vector aTable : ATableT = reshape (aTable, 1, Height (aTable)); and aTableT = rot90 (aTable); According to the head, the last time table should work for table, see. However, I get this error code: Error type in using table / permit (line 396) Undefined function 'permute' for the input arguments. Error in rot 90 (line 29) b = magnitude (b, [2 1 3: ndims (a)]); NB: fliplr is not useful either pretty sure I have covered clear angles - any ideas? Thanks! Try changing your table into an array, move it, then back to a table In other words, try doing this: aTableArray = table2array (aTable); ATableT = array 2table (aTableArray. '); I have also read the document for rot90 , and it says that rot90 is definitely working for tables Do, and I find you...
Read more

c# - Textbox not clickable but editable -

-
I have a small form with 10 text boxes, I have set them in the correct tab order. I want them on my tab service I was wondering if there is a way to set the text box so that they can be selected for editing until they are tabbed. That is ... I do not want the end user to edit the text box to click on them, I just want to make them editable through tabu. this should do the trick public partial category poor text box: Text Box {Safe Override Zero WndProc (Ref: Message Message) {if (m.msg == (Int) WM.LBUTTONDOWN) {Return; // mount down events} base.WndProc (ref m); }} Window message enum can be found. How to do this without anherizing: text box : class EatMouseDown: netwindows {safe override zero WndProc (ref message message) {if (m.msg == (int) WM.LBUTTONDOWN) {return; } Base.WandProc (Ref M); }} Safe Override Zero Onload (EventEurge E) {base.OnLoad (e); How to do this without any part: left a clean part, whatever is important, this can be a buggy but it works R...
Read more