Problem, add a caption to my nivo slider

Hi guys,.

I need assistance with my Nivo Slider that is currently on my site. I tried to add a caption for each image animation block, but nothing works. I have this code in my head, but I do not know how to add a legend.

< script type = "text/javascript" >

{jQuery (window) .load (function ()}

init NivoSlider

jQuery('#slider').nivoSlider ({}

effect: "<?" PHP echo of_get_option ('sl_effect');? > ',

slices: <? PHP echo of_get_option ('sl_slices');? >,.

boxCols: <? PHP echo of_get_option ('sl_box_columns');? >,.

boxRows: <? PHP echo of_get_option ('sl_box_rows');? >,.

animSpeed: <? PHP echo of_get_option ('sl_animation_speed');? >,.

pauseTime: <? PHP echo of_get_option ('sl_pausetime');? >,.

directionNav: <? PHP echo of_get_option ('sl_dir_nav');? >,.

directionNavHide: <? PHP echo of_get_option ('sl_dir_nav_hide');? >,.

controlNav: <? PHP echo of_get_option ('sl_control_nav');? >,.

captionOpacity: <? PHP $sl_caption_opacity = of_get_option ('sl_caption_opacity'); If ($sl_caption_opacity! = ") {echo of_get_option ('sl_caption_opacity') ;} else {echo '0' ;}?}} >

});

});

< /script >

If you see on my site I have a Nivo slider with rotating images - http://www.london-school-of-makeup.com

But I want it to work like this one http://www.gilesforeman.com

I don't know if I need to change the header file or slider.php to make it work. Any help would be greatly appreciated.

Thank you

Line 278 of style.css:

.Nivo-caption {}

display: none! important;

position: absolute;

left: 0px;

Bottom: 0px;

Background: #000;

color: #fff;

opacity: 0.8; / * Overridden by setting captionOpacity * /.

Width: 100%;

z index: 89;

}

Who to change:

.Nivo-caption {}

display: block! important;

position: absolute;

left: 0px;

Bottom: 0px;

Background: #000;

color: #fff;

opacity: 0.8; / * Overridden by setting captionOpacity * /.

Width: 100%;

z index: 89;

}

278-297 lines is the CSS that controls your legend. Here you can style it any way you want.

You can set positions, width, height, drop shadow, CSS Transitions, etc if you want your menu to act as the example site you gave.

Tags: Dreamweaver

Similar Questions

  • How can I add the speaker notes to a slide using applescript?

    How can I add the speaker notes to a slide using applescript? I am able to create slides, add a title and bullet points, but when I try to add the speaker notes, it does not work.

    say thisSlide

    -set the title

    set the text of the object to the default title at "TITLE" element

    -create a bulleted list

    the text of the object of the item to the default body ¬

    "Bullet Point 1" & return & "Bullet Point 2" & return & "Bullet Point 3"»»

    -put the presenter notes

    ¬ the text value of the object of the presenter notes

    '' Here is my presenter notes.

    How can I add the speaker notes to a slide using applescript?

    Maybe like this:

    say thisSlide

    -put the presenter notes

    Set presenter notes to "here is my presenter notes.

    end say

  • Add a caption to a picture in Word

    Hey everybody,

    Does anyone know how to add a caption to a picture in word by using the Toolbox to generate report for the Office? I got in what concerns the addition of a line of text before but I'm looking to add it to the place as a legend under.

    Thanks in advance,

    Anthony

    Something like this will work for you.  Make sure that all text put you in the field of the label is already added to the collection in Word, in the case otherwise there will be error.  Word preserves a collection of these labels, which can be accessed programmatically by using the object of applications and selecting the CaptionLabels property.

    EDIT: updated image to show the CaptionLabels property.

  • How to add a caption to an image for printing

    Is their a way to add a caption to an image, so it will display on the picture? I would like a different caption for each photo.

    I have what is called windows Photo Gallery.

    I would like to add a caption to each photo separately and do print on the photo

    I have what is called windows Photo Gallery.

    I would like to add a caption to each photo separately and do print on the photo

    =====================================
    Not an option in the Windows Photo Gallery.

    Easy to do with Picasa free software:

    (FWIW... it's always a good idea to create a system)
    Restore point before installing software or updates)

    Picasa
    http://Picasa.Google.com/

    After you download and install Picasa...
    Open the program and double left click
    an image to open the editing functions.

    To add text to the front of the photo...
    choose... Simple retouching / text button...

    More info...

    How to add text to your Photos using
    Google Picasa 3
    http://www.ehow.com/how_4599330_text-photos-using-Googles-Picasa.html

    Volunteer - MS - MVP - Digital Media Experience J - Notice_This is not tech support_I'm volunteer - Solutions that work for me may not work for you - * proceed at your own risk *.

  • How can I add a caption to my photos

    How can I add a caption to my photos

    You can use microsoft Paint to add text to the face of the files,

    Click Add text on the right side,

    http://Windows.Microsoft.com/en-us/Windows7/using-paint

  • How can I add a caption at the bottom of an image?

    I use cs4 and I made small images appearing when you click on a large image and I want to add a caption on the image to appear below.

    .

    It depends on how you do large images appear.

    I think that the modal windows are good for that. But not all the scripts of modal window supports captions / titles.

    The demo of code below uses 2 components in Bootstrap - sensitive framework

    Captions are in

    and

    Tags.  Needless to say, you can style captions carousel but you want with CSS.  This example shows the default styles of Bootstrap.

    Bootstrap Modal + Carousel Gallery - http://alt-web.com/

    Nancy O.

  • How to change the date of transition to the jpuery.nivo.slider.pack.js (Dreamweaver template)

    I have a slide show, and the time is 2 seconds.  I wish I had a slide or fade right from one slide to another.  How do I do that?  I am able to change the pause time, but may not know how to change the transition.  Here is the part of the code:

    1. a.fn.nivoSlider.defaults = {effect: 'fade', animSpeed:50, pauseTime:2e3, startSlide:0, directionNav:true, directionNavHide:true, controlNav:true, is controlNavThumbs:fal, controlNavThumbsFromRel:false, controlNavThumbsSearch: ".jpg", controlNavThumbsReplace: "_t humb.jpg", keyboardNav:true, pauseOnHover:true, manualAdvance:false, captionOpacity:.8, prevTex t:"Prev",nextText:"Next",randomStart:false,beforeChange:function() {}, event: function () {}, {slideshowEnd:function(){},lastSlide:function(){},afterLoad:function()}} "}

    I can change the pause time (value 2 seconds now), but I tried to change the animSpeed for: 1 and: 100, but no change.  I tried to change the effect: "default", "fade", and

    "sliceDownRight" and others in the code below, which is beyond the performed: 'fade' code I'm working with.

    if(d.Effect=="Random") {var i = new Array ("sliceDownRight", "sliceDownLeft", "sliceUpRight", "sliceUpLeft", "sliceUpDown", "sliceUp DownLeft", "fold", "fade", "boxRandom", "boxRain", "boxRainReverse", "boxRainGrow", "boxRainGrowR everse") }

    Can anyone help?

    Thank you

    Most widgets have a constructor that allows you to apply changes to the functioning of the widget.

    Here is the constructor for the Nivo Slider settings

    $('#slider').nivoSlider ({}

    effect: 'random', / / Specify defines as: "bend, bland, sliceDown.

    slices: 15, / / for the animations of the slice

    boxCols: 8, / / for the animations of the box

    boxRows: 4, / / for the animations of the box

    animSpeed: 500, / / speed of slide transition

    pauseTime: 3000, / / how long each slide will show

    startSlide: 0, / / Set from slides (index 0)

    directionNav: true, / / next & previous navigation

    controlNav: true, / / 1,2,3... Navigation

    controlNavThumbs: false, / / use tiles for a control Nav

    pauseOnHover: true, / / Stop animation while hovering

    manualAdvance: false, / / hand strength of transitions

    prevText: 'Prev', / / Prev directionNav text

    nextText: 'Next', / / Next directionNav text

    randomStart: false, / / Start on a slide at random

    Beforechange: function() {}, / / triggers before a transition between slides

    Event: function() {}, / / triggers a transition between slides

    slideshowEnd: function() {}, / / triggers after all slides should have been disclosed

    lastSlide: function() {}, / / when the last slide is indicated

    postcharge: function() {} / / triggers when the cursor is loaded

    });

    The effect parameter can be one of the following:

    • sliceDown
    • sliceDownLeft
    • sliceUp
    • sliceUpLeft
    • sliceUpDown
    • sliceUpDownLeft
    • fold
    • fade
    • random
    • slideInRight
    • slideInLeft
    • boxRandom
    • boxRain
    • boxRainReverse
    • boxRainGrow
    • boxRainGrowReverse
  • Nivo Slider only works in Chrome

    HI - hope someone can help.  I've implemented this for a client in Dreamweaver - it's the Nivo slider.

    http://designerandpublisher.com/Nivo-slideshow/demo/Demo2.html

    It seems to do the fancy chrome transition, but there is no transition in Internet Explorer.  It changes just from one slide to another without transition fantasy.

    Anyone know what this could be and have a fix?

    Thanks, Guy deaf

    I'm positive.

    I get the gradient/wipe transition in...

    IE 9.0.81123.16421 64-bit Edition

    16.0 Firefox

    Chrome 22.0.1229.94 m

    Opera 12.02

    Safari 5.1.7

    It does not work however IE9, IE8 Mode or IE7 compatibility mode.

  • CP6 - need to add an audio button on quiz slides to "read aloud the question."

    CP6 - need to add an audio button on quiz slides to "read aloud the question." Most of our target audience is younger (grade 1-5) and provide more accurate results, if each question is 'read' for them. Of course there are big players in the Pack, but the option should be available to listen to the question and not have to read it. Therefore, there is a button to trigger the audio on every issue. Ideas?

    You don't need a button. Just add a legend of the question bearing slides a sound add you the portion of the legend. You can hide the legend by making it transparent.

  • Cannot add a button on a quiz slide

    I'm creating a quiz in captivate 5 and I want to add a next button on each slide of the questionnaire. So I went to the Insert > object Standard and option button is grayed. I'm not on amaster Slide where I know that the button cannot be added. I know there are other ways to do this, but it seems logical to then have a back, and submit button on each slide. Thank you!

    The jump key which is on the question slide double up as a button (for review).

    Since you are fairly new to the forum: If the answer to your question, could you please mark as well?

    Lilybiri

  • Nivo slider in a flash site... ?

    I have a site in flash and html website. I use Nivo slider on the html site as a showcase picture slideshow and slides of slogan, I'm curious to know if anyone knows if you can put a Nivo slider slideshow in a flash site? Nivo slider using jquery, with fairly simple html img src code and a css file, is it possible to have this in a flash site?

    Thnaks in advance!

    Donnie

    Nivo code looks like this;

    < / head >
    "< link rel ="stylesheet"href="Nivo_slide/scripts/nivo-slider-2.css "type =" text/css"media ="screen"/ >
    "< script src="Nivo_slide/scripts/jquery-1.5.1.min.js "type =" text/javascript"> < / script >
    "< script src="Nivo_slide/scripts/jquery.nivo.slider.js "type =" text/javascript"> < / script >
    < / head >

    < body >

    < div id = 'cursor-wrapper' >

    < div id = "slider" class = "nivoSlider" >
    "< img src="Nivo_slide/images/nivo_images-tag-3.jpg "alt =" "/ >"
    "< img src="Nivo_slide/images/nivo_images-weddings_1.jpg "alt =" "/ >"
    "< img src="Nivo_slide/images/nivo_images-weddings_2.jpg "alt =" "/ >"

    < / div >
    < / div >
    < script type = "text/javascript" >
    {$(window) .load (function ()}
    $('#slider').nivoSlider ();

    });
    < /script >

    Flash takes supported a very limited number of html tags - used in the TextField objects - the complete list can be found if you search for the htmlText of the TextField class property.  Out of what you show, are supported only the img tags.

  • Allow users to add the caption of the checkbox

    I created a sform which includes a standard set of checkboxes with most of the items that users would be able to select, what I would do is allow users to add another check box and then enter the legend, or default provide empty check boxes and allow users to add the caption in this way.

    Hello

    The easiest way would be to have a checkbox without legend and then place a textfield to the right. Optionally set the border of the textfield none or a continuous line.

    You could have the box and textfield in a repetitive subform, with a button add a checkbox.

    Hope that helps,

    Niall

  • Adobe Captivate 5 - I need to add a mouse movement to a slide that does not...

    I am trying to create training/videos for a drawing software.  Captivate recognizes not that there is a movement of the mouse, as the mouse does not 'click' at the end of the movement, only the Enter key is used.  I need to add a mouse movement so that my clients can see the action taking place better.  I can't find how to add a mouse movement to a slide that is not a mouse already assigned to it.  Any help at all would be greatly appreciated.  Furthermore, I already tried a copy of another mouse slide... It is not possible.


    Thank you all in advance!

    Hello

    Right-click the slide in the Filmstrip and choose mouse > see the mouse.

    See you soon... Rick

    Useful and practical links

    Captivate wish form/Bug report form

    Certified Adobe Captivate training

    SorcererStone blog

    Captivate eBooks

  • Add a watermark to all the slides in a project

    I have a project with multiple slides already created. I would like to add an image as a watermark in the corner of each slide. I added it to the first slide and I thought when I clicked on the 'Apply to all' checkbox on the properties of the image screen that it spread to all the slides. But this does not happen. I selected 'apply to all' under the settings button.

    How can I add an image to all the slides in the exact same task?

    Hello

    Apply to all applies settings to all objects of the same type.

    If you want your image to be displayed on all slides, double-click it, then click the Options tab. Click the display of the drop-down list, and then choose the rest of the project.

    See you soon... Rick

    Useful and practical links

    Captivate wish form/Bug report form

    Certified Adobe Captivate training

    SorcerStone blog

    Captivate eBooks

  • Add a caption to several files

    I'm trying to add a caption to several files at once - but this does not work in Lightroom. I select several files in the library grid view, then I type in the caption and press ENTER. But the legend goes that in a single file at a time. What I am doing wrong?

    Thank you.

    In menu metadata, remember that "Show metadata for objective picture Only" is NOT checked. If it is enabled, the behavior you describe will occur.

Maybe you are looking for