Results 1 to 6 of 6

Thread: Text and Image Crawler

  1. #1
    Join Date
    Apr 2008
    Location
    near Stuttgart
    Posts
    12
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Default Text and Image Crawler

    Text and Image Crawler

    http://www.dynamicdrive.com/dynamici...wler/index.htm


    I'm just using the amazing "Text and Image Crawler" and it work.
    But now I've a problem, maybe little for you but hugh for me.

    So my question:

    I'd like to use a script like this (see above) but one more layer is above the layer with the script. So this image layer forbit the function which makes layer with the script when moving the mouse right or left. This image is neccesary cause it covers the images of the crawler with a transparent area.

    See here the incomplete site
    http://www.im-grafik.de/test_corporatedesign.html

    It would help me a lot if someone know any solution!

    Many thanks
    Isabel

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    You would have to split up your images that cover the marquee a bit more to get this to work right, but after the browser parses the layers that cover the crawler and after the code that initiates the crawler, you can obtain a reference to the crawler's controlling division's function like so:

    Code:
    var mm = document.getElementById('Layer26').getElementsByTagName('div')[0].getElementsByTagName('div')[0].onmousemove;
    You can then assign it to any other layer(s):

    Code:
    document.getElementById('Layer23').onmousemove = mm;
    To see how this would work, paste this into the browsers address bar after the page has loaded:

    Code:
    javascript:void(document.getElementById('Layer23').onmousemove = document.getElementById('Layer26').getElementsByTagName('div')[0].getElementsByTagName('div')[0].onmousemove)
    and hit enter. Then move your mouse over the gray abdecker_links.png image, the first on the left. The crawler now reacts to movement over it. However, it's too big. That's why these covering images would need to be cut into smaller pieces so that the ones that cover the crawler only cover the crawler and nothing else.
    - John
    ________________________

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

  3. #3
    Join Date
    Apr 2008
    Location
    near Stuttgart
    Posts
    12
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Default

    Hi John,
    thanks for your reply and the full description.
    Sorry but unfortunately I'm really not into javascript and now I don't really know where to paste the codes into the page. Or is it into the crawler.js?
    If you don't mind please give me a instruction where to modify the given codes.
    I'd very appreciated.
    Many thanks, Isabel

  4. #4
    Join Date
    Apr 2008
    Location
    near Stuttgart
    Posts
    12
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Default

    Again me,
    I tried to paste the codes in the page and it works ***yippiee***
    But now I need to know how this works without the address (by the way, why does it work just with this address?)
    "javascript:void(document.getElementById('Layer23').onmousemove = document.getElementById('Layer26').getElementsByTagName('div')[0].getElementsByTagName('div')[0].onmousemove)"
    and the same for the right gray area.
    Sorry for being so annoying /

    Many thanks in advance
    Isabel

  5. #5
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    No problem, I was afraid you might need more of an explanation. I was in a rush and hoped it be enough. It's just as well though because I decided to try it out and discovered a glitch in IE and Opera that requires a bit more coding.

    Get rid of this:

    Code:
    var mm = document.getElementById('Layer26').getElementsByTagName('div')[0].getElementsByTagName('div')[0].onmousemove;
    
    document.getElementById('Layer23').onmousemove = mm;
    document.getElementById('Layer25').onmousemove = mm;
    }
    You may put the code like so (added after your init for crawler):

    Code:
    <script type="text/javascript">
    marqueeInit({
    	uniqueid: 'mycrawler2',
    	style: {
    		'padding': '2px',
    		'width': '600px',
    		'height': '180px'
    	},
    	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
    });
    (function(){
    	function setReact(){
    		var mm = document.getElementById('Layer26').getElementsByTagName('div')[0].getElementsByTagName('div')[0].onmousemove;
    		document.getElementById('Layer23').onmousemove = document.getElementById('Layer25').onmousemove = mm;
    
    	}
    	function reactTime(){
    		setTimeout(setReact, 300);
    	}
    	if(window.addEventListener){
    		window.addEventListener('load', reactTime, false);
    	} else if(window.attachEvent){
    		window.attachEvent('onload', reactTime);
    	}
    })();
    </script>
    Any more questions, feel free to ask.
    - John
    ________________________

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

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

    isrie (04-28-2010)

  7. #6
    Join Date
    Apr 2008
    Location
    near Stuttgart
    Posts
    12
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Default

    Hey John,

    I'm so impressed by your help that I don't know how to communicate my thank.
    Thank you soooo much!!!!!!!!!!!!!!!!!!!

    I copied the code in the page and of course it work perfectly. Wow
    I'm really happy!

    Even though I don't understand how this all work it motivated me to learn a bit of javascript and stuff.

    Again, many many thanks and I'll surely come back to you when I need a specialist in javascripting... )

    THANKS
    Isabel

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
  •