Page 2 of 3 FirstFirst 123 LastLast
Results 11 to 20 of 24

Thread: Text and Image Marquee Crawler v1.53 help please

  1. #11
    Join Date
    Jan 2011
    Posts
    16
    Thanks
    6
    Thanked 0 Times in 0 Posts

    Default

    ok yes, it makes since, but going back a little to position, please.

    On this site: http://www.htmlgoodies.com/beyond/cs...ng-Huh.htm#its
    "Quote" It says, "position:absolute; states that the image will go exactly where I say it will. If text or another picture is already there -- tough. This will go right over top of it. That is one of the drawbacks to this positioning stuff. "
    Position:absolute worked on the trackbed.gif. But when I added another track a couple of px above, it completely hid the first track also the train when I tried to up it by a couple of px above the train.gifs too. It appears as though it will not let the gifs overlap in the "position=absolute". I have tested it over and over and keep coming up with the same thing.

    The trackbed.gif is positioned well, no problem with that for now, But when I put a:
    style="position:absolute; TOP:517px; LEFT:10px;" after the Id crawlers both train gifs are hidden completely.
    What am i doing wrong? Please look at my source.

    ps: The htmlgoodies.com site is great, easy to understand. Thanks.

  2. #12
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    2,024
    Thanks
    16
    Thanked 315 Times in 313 Posts
    Blog Entries
    13

    Default

    I just looked at your source code but the script calls for each marquee are missing - there are only pairs of empty script tags that look like this;
    Code:
    <script type="text/javascript">
    //
    </script>
    Is your web page editor removing the scripts? Try using something like Notepad++ http://www.google.com/m?q=notepad%20plus%20plus (or even good old Notpad in your Windows programme accessories folder) to edit your web page.

    Once the scripts are back in place we can work more on positioning.
    Focus on Function Web Design | Latest News RSS | Facebook | Twitter |
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps |
    The only limit to creativity is imagination: JemCon.org

  3. #13
    Join Date
    Jan 2011
    Posts
    16
    Thanks
    6
    Thanked 0 Times in 0 Posts

    Default

    I haven't done anything different(using notepad). The only thing different is this code that I see in my source.
    When I added the "style="position:absolute; TOP:517px; LEFT:10px; "
    to mycrawler and mycrawler2 the train.gifs just disappeared from the page.
    I will go back to the original so you can see. I dont know what happened.

    The original is there now. both trains are showing as before. All I did was remove the style from the div class in both mycrawler and mycrawler2. umph??

    <!-- ============ Begin Train Marquee ============== -->
    <table width="0" cellpadding="0" cellspacing="0" border="0">
    <tr>
    <td valign="middle">

    <div class="marquee" id="mycrawler" style="position:absolute; TOP:517px; LEFT:10px;" >
    <img src="images/shastadaylight.gif" alt="" />
    <img src="images/sanfranciscochief.gif" alt="" />

    </div>
    <script type="text/javascript">
    //<![CDATA[
    marqueeInit({
    uniqueid: 'mycrawler',
    style: {
    'padding': '2px',
    'width': '990px',
    'height': '25px'
    },
    inc: 5, //speed - pixel increment for each iteration of this marquee's movement
    mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false)
    moveatleast: 2,
    neutral: 150,
    direction: 'right',
    savedirection: true,
    random: true
    });
    //]]>
    </script>


    <div class="marquee" id="mycrawler2" style="position:absolute; TOP:517px; LEFT:10px;">
    <img src="images/shastadaylight.gif" alt="" /> <img src="images/sanfranciscochief.gif" alt="" />
    </div>
    <script type="text/javascript">
    //<![CDATA[
    marqueeInit({
    uniqueid: 'mycrawler2',
    style: {
    'padding': '2px',
    'width': '990px',
    'height': '25px'
    },
    inc: 5, //speed - pixel increment for each iteration of this marquee's movement
    mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false)
    moveatleast: 2,
    neutral: 150,
    savedirection: true,
    random: true
    });
    //]]>
    </script>

    </td>
    </tr>
    </table>



    <IMG STYLE="position:absolute; TOP:537px; LEFT:10px; WIDTH:990px; HEIGHT:5px" SRC="images/trackbed.gif">
    <!-- ============ END Train Marquee ============== -->

  4. #14
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    2,024
    Thanks
    16
    Thanked 315 Times in 313 Posts
    Blog Entries
    13

    Default

    I think the javascript is modifying the style attribute - no worries - try wrapping the crawler div in another set of div tags and add the style="" to that instead.
    Code:
    <div style="">
          <DIV id="mycrawler2" class="marquee"><IMG alt="" src="About%20Railmember%20Fan%20Site_files/shastadaylight.gif"> 
          <IMG alt="" src="About%20Railmember%20Fan%20Site_files/sanfranciscochief.gif">
          </DIV>
    </div>
    Focus on Function Web Design | Latest News RSS | Facebook | Twitter |
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps |
    The only limit to creativity is imagination: JemCon.org

  5. #15
    Join Date
    Jan 2011
    Posts
    16
    Thanks
    6
    Thanked 0 Times in 0 Posts

    Default

    ok I have wrapped the crawler divs in another set of div tags. I see my source on the net but the train.gifs have disappeared again. The tracks are still there.
    Here's the source:

    <div style="">
    <div class="marquee" id="mycrawler" style="position:absolute; TOP:517px; LEFT:10px;" >
    <img src="images/shastadaylight.gif" alt="" />
    <img src="images/sanfranciscochief.gif" alt="" />
    </div>
    </div>


    ps. Would you be so kind as to direct me to an easy site that explains divs and what they are all about. I am so used to html basic code but never learned about divs. I would like to understand them, please.

  6. #16
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    2,024
    Thanks
    16
    Thanked 315 Times in 313 Posts
    Blog Entries
    13

    Default

    You still have the style attribute inside the "mycrawler" div so the same thing as before is still happening.

    What I meant was to remove the styling from the "mycrawler" div (as you currently have it) and instead style the div on the outside of that;
    Code:
    <div style="position:absolute; TOP:517px; LEFT:10px;" >
         <div class="marquee" id="mycrawler" >
              <img src="images/shastadaylight.gif" alt="" /> <img src="images/sanfranciscochief.gif" alt="" />
         </div>
    </div>
    A div is just a container for other elements, but here's some info as requested: http://www.tizag.com/htmlT/htmldiv.php
    Focus on Function Web Design | Latest News RSS | Facebook | Twitter |
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps |
    The only limit to creativity is imagination: JemCon.org

  7. The Following User Says Thank You to Beverleyh For This Useful Post:

    rlhenryjr (03-18-2013)

  8. #17
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,126
    Thanks
    44
    Thanked 3,228 Times in 3,189 Posts
    Blog Entries
    12

    Default

    Beverleyh meant:

    Code:
    <div style="position:absolute; TOP:517px; LEFT:10px;">
     <div class="marquee" id="mycrawler">
     <img src="images/shastadaylight.gif" alt="" /> 
     <img src="images/sanfranciscochief.gif" alt="" />
     </div>
     </div>
    And she's right. You cannot apply style directly to the class="marquee" div.

    Alternatively you can use the style property of the init, see the script's documentation for specifics. Do not do both. Example of using the init's style property:

    Code:
    <script type="text/javascript">
    marqueeInit({
    	uniqueid: 'mycrawler',
    	style: {
    		'padding': '5px',
    		'width': '450px',
    		'background': 'lightyellow',
    		'border': '1px solid #CC3300'
    	},
    	inc: 5, //speed - pixel increment for each iteration of this marquee's movement
    	mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false)
    	moveatleast: 2,
    	neutral: 150,
    	persist: true,
    	savedirection: true
    });
    </script>
    Zooming in on the highlighted section, you would do like:

    Code:
    	style: {
    		'position': 'absolute',
    		'top': '517px',
    		'left': '10px',
    		'height': '250px' //change the height to the desired height
    	},
    Further, to your question about the div tag - The div is a generic block level tag with no other special properties. Any good HTML reference will tell you about it. It's a lot like the p tag, except that it is not self closing (means it needs a closing </div> tag to close it, a p tag will close, in addition to the usual ways, when it hits the next opening block level element) and unlike p, div has no default margin.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  9. The Following User Says Thank You to jscheuer1 For This Useful Post:

    rlhenryjr (03-18-2013)

  10. #18
    Join Date
    Jan 2011
    Posts
    16
    Thanks
    6
    Thanked 0 Times in 0 Posts

    Default

    I am so thankful for the help from you both Beverleyh and John.
    I have learned a lot.
    I have made the corrections and the code can be seen in the source.
    Please tell my why I see only one of the two trains going to the left when they should be passing one another going in opposite directions and appear to be on the same track? It looks like my code is correct now. But I also noticed that the tran.gifs and track are now covered my my google ad which wasn't a problem before. Please tell me how to correct that.
    I know this has to do with the position but this is a new problem.

  11. #19
    Join Date
    Jan 2011
    Posts
    16
    Thanks
    6
    Thanked 0 Times in 0 Posts

    Default

    Thanks also for the info on divs. The webpage you sent me to was the first time I really understood divs and seeing an example. Very helpful. thanks again to both of you.

  12. #20
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,126
    Thanks
    44
    Thanked 3,228 Times in 3,189 Posts
    Blog Entries
    12

    Default

    On that page I see two crawlers. They are both the exact same size and both in the exact same position. Since they are both positioned absolute, the second one covers the first one. If you want both to be seen in the way I think that you're describing, they should each be half the width that they are now, and one should be positioned farther to the right by that same amount. Something like (changes in 3 places highlighted):

    Code:
    <div style="position:absolute; TOP:507px; LEFT:10px;">
    <div class="marquee" id="mycrawler" >
    <img src="images/shastadaylight.gif" alt="" /> 
    <img src="images/sanfranciscochief.gif" alt="" />
    </div>
    </div>
    <script type="text/javascript">
    //<![CDATA[
    marqueeInit({
            uniqueid: 'mycrawler',
            style: {
                    'padding': '2px',
                    'width': '495px',
                    'height': '25px'
    	},
            inc: 5, //speed - pixel increment for each iteration of this marquee's movement
            mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false)
            moveatleast: 2,
            neutral: 150,
            direction: 'right',
            savedirection: true,
            random: true
    });
    //]]>
    </script>
    <div style="position:absolute; TOP:507px; LEFT:505px;">
    <div class="marquee" id="mycrawler2">
    <img src="images/shastadaylight.gif" alt="" /> <img src="images/sanfranciscochief.gif" alt="" />
    </div>
    </div>
    <script type="text/javascript">
    //<![CDATA[
    marqueeInit({
            uniqueid: 'mycrawler2',
            style: {
                    'padding': '2px',
                    'width': '495px',
                    'height': '25px'
            },
            inc: 5, //speed - pixel increment for each iteration of this marquee's movement
            mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false)
            moveatleast: 2,
            neutral: 150,
            savedirection: true,
            random: true
    });
    //]]>
    </script>
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Similar Threads

  1. Replies: 0
    Last Post: 11-01-2011, 09:49 PM
  2. Text and Image Crawler - multiple lines of text
    By jeffshead in forum Dynamic Drive scripts help
    Replies: 3
    Last Post: 08-21-2011, 01:40 PM
  3. Centering Image marquee crawler issue
    By fankfulpixy in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 01-17-2011, 07:56 AM
  4. DD Text and Image Crawler marquee style to CSS
    By john7p in forum Dynamic Drive scripts help
    Replies: 6
    Last Post: 08-17-2010, 04:17 PM
  5. DD Text and Image Crawler align img with text-bottom
    By john7p in forum Dynamic Drive scripts help
    Replies: 4
    Last Post: 05-16-2010, 03:43 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •